8

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
    }
}

ドキュメント ビューのモデルを作成し、その変更をリッスンする必要がありますか?

4

2 に答える 2

17

バックボーン イベントを使用して、関数呼び出しをトリガーできます。これには、「子」ビューがその親について知る必要がないという利点があります。

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 );
  }
});
于 2013-06-12T23:55:47.173 に答える
1

モデルが必要ない場合は、オプションを介して親ビューへの参照を子ビューに渡すことをお勧めします。モデルが必要な場合は、親ビューを介してモデルの変更をリッスンします。私はタイプスクリプトに慣れていませんが、次のようなことをしたいと思っています:

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

次に、子ビューで次のようにアクセスできるはずです。

this.options.desktopView
于 2013-06-12T16:07:08.297 に答える