私はbackbone.jsを使用してWebアプリケーションを作成しています。2つのタブがあります。タブ1はbackbone.jsビューであり、tab2は別のバックボーンビュー（同じ種類）です。
両方のビューがページ内の同じdiv要素にロードされます。現在私がしているのは、ユーザーがタブを変更すると、バックボーンルーターを使用してタブを検出することです。次に、ルータはビューがすでに存在するかどうか、またはビューを作成する必要があるかどうかを確認します。
キーに基づいてビューオブジェクトを格納するオブジェクトマネージャーオブジェクトを作成しました（キーはタブ名です）
App.ObjectManager.getContentView = function (tabId) {
return App.ObjectManager.ContentHash[tabId];
};
App.ObjectManager.setContentView = function(tabId, view) {
App.ObjectManager.ContentHash[tabId] = view;
};
App.ObjectManager.hasContentView = function(tabId) {
if(App.ObjectManager.ContentHash[tabId]==undefined) {
return 0;
}
else{
return 1;
}
};
リストオブジェクトへのビューを作成して保存するために私が行うことは次のとおりです。このコードは、タブがクリックされるたびに呼び出され、ルーターが変更を検出します。
$("#myDiv").html("");
if(App.ObjectManager.hasContentView(tabId)==0) { //View is not in the lookup table
console.log("View is not created yet. So we need to create");
content = new App.MyBackboneView(); //create a new view
App.ObjectManager.setContentView(tabId, content); //Store the view
}
else {
console.log("View is already created..So we read it and show it");
content = App.ObjectManager.getContentView(tabId);
}
//Now, we add the view to the main div
$("#myDiv").append(content.el);
上記のコードは、myDivにビューを表示することで機能します。テキストボックスやラジオボタンなどの値が表示されているのがわかります。
唯一のこと-イベント処理は機能しません。そのため、ビューにイベントハンドラーが追加されたボタンがある場合、保存されたオブジェクトからビューがレンダリングされたときにイベントが呼び出されません。ビューが初めて表示されるときは、クリックイベントが処理されています。
たとえば、「Say MyName！」ビューにこのボタンがあります。
events: {
"click #say": "sayName"
},
sayName: function() {
console.log("I click say Name");
}
ビューが初めて読み込まれるときにボタンを押すと、コンソールにログが表示されます。もう一度タブに戻って、今度はリストオブジェクトからビューが表示されると、クリックイベントが機能しません。
私のコードに問題はありますか？
ビューを保存する方法を教えていただければ幸いです。ビューを再利用できます。
ありがとう。