管理与路由器意见Backbone.js的

Question

我在具有以下布局的单页的应用程序工作：

我使用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列表项，＃内容1被产生，当我这样做是对＃内容1块，＃CONT3出现。

我面对的问题是，如果出于某种原因，例如当地址为localhost/content1时刷新页面; #List中的元素消失。

我希望#List中的内容在加载时始终存在，与URL的内容无关，以及＃Content1中的内容。有没有办法使用骨干路由器来实现这一点？

感谢

Answer 1

你并不需要匹配1路< - > 1查看。
我的路线更改为类似这样：

“清单”： “displayContent”，
“列表/：C1”： “displayContent”，
“列表/：C1 /：C3” ：“displayContent”，

所以只有一个回调组织什么视图被渲染或不是。

displayContent：函数（C1，C3）{

商店的内容1变量，并检查是否已被或不呈现等

，看一下这个问题：How to handle initializing and rendering subviews in Backbone.js?

或者对于更复杂的应用程序，也许在Backbone顶部的布局框架可以提供帮助，但我会建议您自己做些东西，直到您了解Backbone的工作方式。

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

Answer 2

我想你可以试试这个：

..... 
    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. 
     }; 
    }, 

.....