Question

我是Backbone的新手，我想知道这方面的最佳做法 - 我想要一个简单的方法与孩子的父视图进行通信，即在父母上调用方法。

下面使用“桌面”和“文档”视图的基本示例：

class DesktopView extends Backbone.View{
    constructor(options?) {
        super(options);
        this.el = $('#desktop');
        this.createDocument();
    }
    createDocument() {
        dv = new DocumentView();
        $(this.el).append(dv.render());
    }
}

class DocumentView extends Backbone.View{
    constructor(options?) {
        super(options);        
        this.tagName = 'div';
        this.className = 'document';
        this.events = {
            "click": "clickHander"
        };
    };
    render() {
        return this.el;
    }

    clickHandler() {
       //COMMUNICATE WITH THE DESKTOP VIEW
    }
}

我应该为文档视图创建模型并监听对其的更改吗？

Answer 1

您可以使用Backbone事件来触发函数调用。这样做的好处是“孩子”视图不必知道它的父级。

var parent = Backbone.View.extend({
  initialize : function () {
    this.listenTo( Backbone, 'child-click-event', function ( dataFromChild ) {
      this.doSomething( dataFromChild );
    }, this );
  }
 });

var child = Backbone.View.extend({
  //...
  clickHandler : function () {
    var data; // do something and get data
    // Parent listens to this event.
    Backbone.trigger('child-click-event', data );
  }
});

Answer 2

如果您不需要模型，我建议通过子视图的选项将对父视图的引用传递给它。如果你确实需要一个模型，那么是通过父视图监听它的变化。我不熟悉打字稿，但你想做这样的事情：

createDocument() {
        that = this;
        // give reference to parent view
        dv = new DocumentView({desktopView : that});
        $(this.el).append(dv.render());
    }

然后您应该能够在子视图中访问它，如：

this.options.desktopView

骨干 - 从子视图调用/引用父视图

2 个答案: