Question

我有一个Layout（SubMenu100），该事件具有一个可调用其他Layout（SubMenu200）的事件，但是它还会产生一个onClick触发器，该触发器将在if layout（SubMenu100）并调用自身的情况下创建实例，但是我不知道如何以获得类似于下一个代码的实例。

this.SubMenu100 = new SubMenu100();

我尝试将其放在Define vars中，但出现错误。

define([
    'backbone.marionette',
    'underscore',
    'logger',
    'tpl!apps/templates/SubMenu100.html',
    'i18n!apps/nls/Messages',
    'apps/views/SubMenu200',
    'apps/views/SubMenu100'
], function (Marionette, _, Logger, Template, i18n, SubMenu200, SubMenu100) {
    launch: function (e) {
        $("#title_wrapper_div").click(this.callMe);
    },
    callMe: function () {            
        if (this.subMenu100 === undefined) {
            this.subMenu100 = new SubMenu100(); // <- here
        }
        window.App.vent.trigger("dashboard:showView",this.subMenu100, "", "", "", "");
    }
}

所以，这是一个问题，如何在其内部创建SubMenu100的实例？

Answer 1

如果在上下文launch中调用SubMenu100，则可以执行this.callMe.bind(this)，则应该可以在new this()内执行callMe。

但是为了简单起见，您可以这样做：

define([
    'backbone.marionette',
    'underscore',
    'logger',
    'tpl!apps/templates/SubMenu100.html',
    'i18n!apps/nls/Messages',
    'apps/views/SubMenu200'
  ], function(Marionette, _, Logger, Template, i18n, SubMenu200) {

  var SubMenu100 = Class SubMenu100 {
    launch: function(e) {
      $("#title_wrapper_div").click(this.callMe);
    },
    callMe: function() {
      if (this.subMenu100 === undefined) {
        this.subMenu100 = new SubMenu100();
      }
      window.App.vent.trigger("dashboard:showView", this.subMenu100, "", "", "", "");
    }
  }

  return SubMenu100;
});

请注意，每个launch都可能在同一个元素上创建新的事件处理程序（除非其他操作正在进行适当的清除），这可能会导致错误。我不建议在骨干组件中使用全局jQuery选择器。

如果要创建SubMenu100和SubMenu200的实例，我将创建一个更高级别的组件来负责：

require([
// ^ ------ this is NOT SubMenu100 definition
'apps/views/SubMenu100',
'apps/views/SubMenu200',
], function (SubMenu100, SubMenu200) {
  // this is NOT SubMenu100 definition
  launch: function (e) {
    $("#title_wrapper_div").click(this.callMe);
  },
  callMe: function () {            
    if (this.subMenu100 === undefined) {
        this.subMenu100 = new SubMenu100();
    }
  }
});

如何从自身调用Layout来创建实例

1 个答案: