秘银只重绘1个模块

Question

如果我的页面上有 10 个 m.module，我可以只为其中一个调用 m.startComputation、m.endComputation、m.redraw 或 m.request模块？

看起来这些中的任何一个都会重绘我的所有模块。

我只知道module 1会受到一些代码的影响，我只想让秘银重新绘制。

Answer 1

目前，还没有简单的多租户支持（即运行多个相互独立的模块）。

解决方法包括使用子树指令来防止在其他模块上重绘，例如

//helpers
var target
function tenant(id, module) {
  return {
    controller: module.controller,
    view: function(ctrl) {
      return target == id ? module.view(ctrl) : {subtree: "retain"}
    }
  }
}
function local(id, callback) {
  return function(e) {
    target = id
    callback.call(this, e)
  }
}

//a module
var MyModule = {
  controller: function() {
    this.doStuff = function() {alert(1)}
  },
  view: function() {
    return m("button[type=button]", {
      onclick: local("MyModule", ctrl.doStuff)
    }, "redraw only MyModule")
  }
}

//init
m.module(element, tenant("MyModule", MyModule))

您可能还可以使用 this or this 之类的东西来自动装饰带有 local

的事件处理程序

Answer 2

组件需要多租户支持吗？这是我的 gist link

var z = (function (){
  //helpers
  var cache = {};
  var target;
  var type = {}.toString;
  var tenant=function(componentName, component) {     
      return {
        controller: component.controller,
        view: function(ctrl) {
          var args=[];
          if (arguments.length > 1) args = args.concat([].slice.call(arguments, 1))
          if((type.call(target) === '[object Array]' &&  target.indexOf(componentName) > -1) ||  target === componentName ||  target === "all")
            return component.view.apply(component, args.length ? [ctrl].concat(args) : [ctrl])
          else
            return {subtree: "retain"}
        }
      }
  }
  return {      
    withTarget:function(components, callback) {
      return function(e) {
        target = components;
        callback.call(this, e)
      }
    },    
    component:function(componentName,component){
      //target = componentName;
      var args=[];
      if (arguments.length > 2) args = args.concat([].slice.call(arguments, 2))
      return m.component.apply(undefined,[tenant(componentName,component)].concat(args));
    },  
    setTarget:function(targets){
      target = targets;
    },
    bindOnce:function(componentName,viewName,view) {
      if(cache[componentName] === undefined) {
        cache[componentName] = {};
      }
      if (cache[componentName][viewName] === undefined) {
          cache[componentName][viewName] = true
          return view()
      }
      else return {subtree: "retain"}
    },
    removeCache:function(componentName){
      delete cache[componentName]
    }
  }
})();

秘银只重绘1个模块

Mithril redraw only 1 module

mithril.js