6

Layoutいくつかのタブがあるがあります。これらのタブのいずれかをクリックするとshow、ページのコンテンツに適切な複合ビューが表示されますregion。異なるタブ間を行き来した後、複合ビューがコレクションのリセットとモデルの変更でレンダリングするためのネイティブ バインディングを失っていることに気付きました。

_initialEventsビューを 2 回目に表示するときに、複合ビューで使用されているイベントを再バインドする方法はありshowますか、それともタブごとに新しい複合ビューを作成する必要がありますか?

現在、私は自分のすべてのビューをinitialize自分で作成し、タブがクリックされたときにビューでLayout使用しています。show

initialize: function(){
    _.bindAll(this);

    //     Tabs
    this.places_page   = new Places_Layout();
},

show_places_page: function(){

    this.content.show(this.places_page);
    this.places_page.delegateEvents();
},
4

4 に答える 4

1

タブからタブに切り替えるたびに Layout/Item/Composite/Collection ビューを作成する必要はありません。逆に、コンテンツを変数に保存することもできます。問題は、変数がコンテンツをレンダリングするたびに再宣言されています。解決策は、その変数 (this.places_page) がビューに追加されていない場合に宣言されているかどうかを確認する必要があるため、何度も呼び出すと問題なく同じレイアウト ビューを保持することになります。メイン ビュー (領域を保持するビュー) ネストされた子ビュー (領域内) は、新しいナビゲーションが行われるまで失われます。

initialize: function(){
    _.bindAll(this);

    // You can asign a diferent variable for each view so when you call show_places_page it will render with the same view.

    if (!this.places_page){
         this.places_page   = new Places_Layout();
    }

    // other tab        
    if (!this.other_page){
         this.other_page   = new OtherPage_Layout();
    }

},

show_places_page: function(){

    this.content.show(this.places_page);
    this.places_page.delegateEvents();
},
于 2013-05-16T15:50:28.993 に答える
0

初期化内ですべてのビューを作成しないでください。メモリ リークが発生するため、ビューを動的に作成する必要があります。また、コードの再利用性を高めるために、コンテンツ領域にビューを表示するための共通関数を作成することをお勧めします。次のような解決策をお勧めします。

//define the regions of your layout view
regions: {
  content: '#content'
},
//Maintain a config for the tab content view classes.
contentViews: {
  tab1: Tab1View,
  tab2: Tab2View,
  tab3: Tab3View
},
//keeps all the view instances
viewInstances: {},
/*
 * show tab function is called when you click a tab item.
 * Consider each tab has a attribute for tab name.
 * For example HTML of your one tab is like:
 * <div data-tab-name="tab_name">Tab <tab_name></div> 
 */
showTab: function (e) {
  var tabName = $(e.currentTarget).attr("data-tab-name");
  /*
   * code for showing selected tab goes here...
   */

  //check and create the instance for the content view
  if (!this.viewInstances[tabName]) {
      this.viewInstances[tabName] = new this.contentViews[tabName]();
  }
  //Then here you are actually showing the content view
  this.content.show(this.viewInstances[tabName]);
  this.viewInstances[tabName].delegateEvents(); //this is to rebind events to the view.
}
于 2014-12-23T14:45:42.533 に答える