0

addPost私のルーターには機能があります。postAddView関数が呼び出されるたびにを再作成したくありません。

addPost: function () {
  var that = this;
  if (!this.postAddView) {
    this.postAddView = new PostAddView({
      model: new Post()
    });
    this.postAddView.on('back', function () {
      that.navigate('#/post/list', { trigger: true });
    });
  }

  this.elms['page-content'].html(this.postAddView.render().el);
}

PostAddView は次のとおりです。

PostAddView = backbone.View.extend({
  events: {
    'click #post-add-back': 'back'
  }
  , back: function (e) {
    e.preventDefault();
    this.trigger('back');
  }
});

postAddView が初めてレンダリングされるとき、イベント トリガーは適切に機能します。ただし、他のビューをレンダリングしpage-contentてレンダリングするとpostAddView、イベント トリガーはトリガーされなくなります。ただし、次のバージョンの はaddPostうまく機能します。

addPost: function () {
  var that = this, view;

  view = new PostAddView({
    model: new Post()
  });

  this.elms['page-content'].html(view.render().el);

  view.on('back', function () {
    delete view;
    that.navigate('#/post/list', { trigger: true });
  });
}
4

2 に答える 2

2

どこかでjQueryを呼び出しremoveています

要素自体に加えて、要素に関連付けられたすべてのバインドされたイベントと jQuery データが削除されます。

そのため、delegateバックボーンがイベントをバインドするために使用する呼び出しはpostAddView.el失われます。次に、 を再度追加するpostAddView.elと、 はdelegateもう添付されておらず、イベントはトリガーされません。Backbone.View の標準removeメソッドは jQuery のremove;を呼び出すことに注意してください。emptyイベント ハンドラーに対して同様のことを行うのと同様に、jQuery の他のいくつかのことを行います。したがって、あなたを殺している実際の関数呼び出しは、delegate他の何かの奥深くに隠されている可能性があります。

delegateEvents手動で呼び出すことができます：

this.elms['page-content'].html(this.postAddView.render().el);
this.postAddView.delegateEvents();

または、ビューを破棄して、必要なたびに新しいビューを作成するだけです。ビュー オブジェクトは非常に軽量である必要があるため、既存のビューを手動で追跡するよりも、新しいオブジェクトを作成する方が安価で手間がかかりません。

于 2012-07-02T03:52:50.860 に答える
1

現在の DOM とビューを本当に再利用したい場合は、要素を何度も設定する必要はありません。呼び出したものはすべて.html()、ビューの DOM を破壊し、再度生成してイベントを失います。また、ビューをレンダリングする前に、常にDOMに「el」を追加することを好みます。私はこのようにあなたの機能を持っています：

addPost: function () {
  if (!this.postAddView) {
    this.postAddView = new PostAddView({
      model: new Post()
    });
    this.postAddView.on('back', this.onBack);
    this.elms['page-content'].html(this.postAddView.el);
  }

  this.postAddView.render();

},

onBack : function () {
  this.navigate('#/post/list', { trigger: true });
}

「これ」を参照するためにローカル変数を使用するのは好きではありません。すべてのビューが_.bindAll(this)初期化メソッドで使用する場合、イベントをビューにバインドしてこれを使用できます (onBack の変換方法を確認してください)。

私のコードでは、手動で呼び出す必要はありませんthis.delegateEvents()

于 2012-07-02T21:03:44.123 に答える