バックボーン:ページロード中にレンダリングされたビューを再利用する方法
-
25-10-2019 - |
質問
ユーザーがお気に入りのWebページURLをブックマークし、フォルダーで管理できるURLマネージャーを作成しています。
- アプリのロード中に、ユーザーが作成したフォルダーのリストを表示するビューをレンダリングします。このビューは、ページの読み込みでは見えません。
- 次に、ユーザーは彼のホームページに移動してURLのリストを表示します
- そこから、ユーザーはフォルダにURLをアレンジできます
- ユーザーはURLビューで「フォルダへの移動」アイコンをクリックします
- 「フォルダーへの移動」アイコンの下にあるフォルダーセクタービューの絶対位置を表示したい。どうやってやるの?
- また、URLが既にフォルダーに移動されている場合は、URLが移動されているフォルダーのフォルダーセクタービューにチェックサインを表示する必要があります。
ここでどのように進むべきですか?
フォルダーのリストをロードする方法は次のとおりです。
var folderColl = new FolderColl();
new FolderSelectorView({collection: folderColl});
これがURLビューのコードです。
URLView = Backbone.View.extend({
tagName: 'li',
template: _.template($('#URLTempalte').html()),
events: {
'click .FolderChange': 'showFolderSelector'
},
initialize: function() {
_.bindAll(this, 'render');
},
render: function() {
return $(this.el).html(this.template(this.model.toJSON()));
},
showFolderSelector: function() {
// How should I display the view here
// view should display below the "Move to folder" icon
// Doing something like `new FolderSelectorView` is not what I'm after
// since that will just re-render the view for every URL displayed
}
});
解決
既存のHTML要素にバックボーンビューを簡単に添付できます。あなたがする必要があるのは、合格することだけです el
ビューのために、あなたがそれをインスタンス化するとき、ビューに。 el
jQueryセレクターを介して見られる既存のHTML要素を含む、あなたが望むものにすることができます。
var myEl = $("#someElementOnThePage");
var myView = new MyView({
el: myEl
});
これにより、ビューが添付されます #someElementOnThePage
要素、そしてあなたはそれを自分でレンダリングしたかのようにそれを使用することができます。
その他の例については、プログレッシブの詳細に関する私のブログ投稿を参照してください。 http://lostechies.com/derickbailey/2011/09/26/seo-and-accessibility-with-html5-pushstate-2-part-2-progision-enhancement-with-backbone-js/
所属していません StackOverflow