如何在自身内部引用 Backbone/Marionette 视图？

Question

MyView.js:

define(['app/models/MyModel'],
    function (MyModel) {
        return Mn.LayoutView.extend({
            template: '#my-template',
            className: 'my-classname',
            regions: {
                content: '.content-region',
                panel: '.panel-region'
            }
            initialize: function () {
                _.bindAll(this, 'childButtonClicked');
            },
            onShow: function () {
                this.getRegion('content').show(new AnotherView());
            },
            childEvents: {
                'some-child-click': 'childButtonClicked'
            },
            childButtonClicked: function (view) {
                var newView = new MyView({
                    model: new MyModel({
                        title: view.model.get('title')
                    })
                });
                this.getRegion('panel').show(newView);
            }
        });
    });

我正在尝试将 MyView 的实例嵌套在自身中。当我通过将所有内容转储到一个函数中来构建原型时，这工作正常，如下所示：

var MyView = Mn.LayoutView.extend({
  ...
  childButtonClicked: function(view) {
    var newView = new MyView({
    ...

现在我正试图将视图分离到它们自己的文件中并使用 require.js，我无法弄清楚 self-referential 视图的语法。

当我按原样运行这段代码时，我得到一个错误，如 'MyView is undefined'。

如果我像这样将它添加到需求 header 中：

define(['app/models/MyModel', 'app/views/MyView'],
    function (MyModel, MyView) {

我收到错误 'MyView is not a function'。

编辑解决方案：

标记的解决方案工作正常，我最终使用了 obvious-in-hindslght:

define(['app/models/MyModel'],
    function (MyModel) {
        var MyView = Mn.LayoutView.extend({
            template: '#my-template',
            className: 'my-classname',
            regions: {
                content: '.content-region',
                panel: '.panel-region'
            }
            initialize: function () {
                _.bindAll(this, 'childButtonClicked');
            },
            onShow: function () {
                this.getRegion('content').show(new AnotherView());
            },
            childEvents: {
                'some-child-click': 'childButtonClicked'
            },
            childButtonClicked: function (view) {
                var newView = new MyView({
                    model: new MyModel({
                        title: view.model.get('title')
                    })
                });
                this.getRegion('panel').show(newView);
            }
        });
        return MyView;
    });

Answer 1

您可以 require() 在您的模块中：var MyView = require(app/views/MyView);.

所以想要一个更好的地方：

childButtonClicked: function (view) {
    var MyView = require(app/views/MyView);
    var newView = new MyView({
        model: new MyModel({
            title: view.model.get('title')
        })
    });
    this.getRegion('panel').show(newView);
}

如何在自身内部引用 Backbone/Marionette 视图？

How to reference a Backbone/Marionette View within itself?

javascript

backbone.js

constructor

marionette

backbone-views