5

次のレイアウトのシングルページアプリで作業しています。

アプリのレイアウト

画面に読み込まれる要素を管理するためにBackbone.jsルーターを使用しています。

var AppRouter = Backbone.Router.extend({
    routes: {
        ""              : "list",
        "content1"      : "content1",
        "content1/cont3": "cont3"
    },

    list: function() {
        var list = new List().render().$el; //view
        $("#List").html(list);
    },

    content1: function(){
        var cont1 = new Content1().render().$el; //view
        $("#Content1").html(cont1);
    },

    content3: function(){
        var cont3 = new Content3().render().$el; //view
        $("#Cont3").html(cont3);
    }        

});

#Listのリストアイテムをクリックするたびに、＃Content1が生成され、＃Content1のブロックでクリックすると、＃Cont3が表示されます。

私が直面している問題は、たとえば、アドレスがlocalhost / content1のときに、何らかの理由でページを更新した場合です。#Listの要素が消えます。

#Listのコンテンツは、URLが何であるかに関係なく、ロード時に常に存在し、＃Content1のコンテンツと同様に存在するようにします。バックボーンルーターを使用してこれを実現する方法はありますか？

ありがとう

4

2 に答える 2

4

1つのルート<->1つのビューに一致する必要はありません。
ルートを次のように変更します。

"list"： "displayContent"、
"list /：c1"： "displayContent"、
"list /：c1 /：c3"： "displayContent"、

したがって、レンダリングされるビューとレンダリングされないビューを整理するのは1つのコールバックだけです。

displayContent：function（c1、c3）{

content1変数を格納し、既にレンダリングされているかどうかなどを確認します。

この質問をご覧ください：Backbone.jsでサブビューの初期化とレンダリングを処理する方法は？

または、より複雑なアプリの場合は、Backboneの上部にあるレイアウトフレームワークが役立つ可能性がありますが、Backboneの動作を理解するまでは、独自の作業を行うことをお勧めします。

https://github.com/tbranyen/backbone.layoutmanager
https://github.com/derickbailey/backbone.marionette

于 2012-07-10T21:21:21.367 に答える
0

私はあなたがこれを試すことができると思います：

.....
   list: function() {
        var list = new List().render().$el; //view
        $("#List").html(list);
    },

    content1: function(){
        var cont1 = new Content1().render().$el; //view
        $("#Content1").html(cont1);
        //Pseudo code
        if (listisempty){
           list();//If the list is empty, then the initialization list.
        };
    },

.....
于 2012-07-10T15:52:06.493 に答える