秘银重绘只有1个模块

时间:2015-02-19 17:50:55

标签: mithril.js

如果我的页面上有10个m.module,我是否可以仅针对其中一个模块致电m.startComputationm.endComputationm.redrawm.request

看起来这些都会重绘我的所有模块。

我知道只有module 1会受到某些代码的影响,我只希望秘密重绘它。

2 个答案:

答案 0 :(得分:5)

目前,对多租户没有简单的支持(即,彼此独立地运行多个模块)。

解决方法将涉及使用子树指令来防止在其他模块上重绘,例如

//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))

您可能还可以使用thisthis之类的内容来自动装饰具有local的事件处理程序

答案 1 :(得分:1)

需要多租户支持组件吗?这是我的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]
    }
  }
})();