秘银仅重绘 1 个模块答案

【问题标题】：Mithril redraw only 1 module秘银仅重绘 1 个模块
【发布时间】：2015-02-19 17:50:55
【问题描述】：

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

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

我知道只有module 1会受到一些代码的影响，我只希望秘银重绘它。

【问题讨论】：

标签： mithril.js

【解决方案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 或 this 之类的东西来自动装饰带有 local 的事件处理程序

【讨论】：

这里是带有组件支持的要点链接：gist.github.com/dhinesh03/4408820e78d14738f979

【解决方案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]
    }
  }
})();

【讨论】：