Javascript 主干客户端路由器:如何优化
我有以下路由配置:Javascript 主干客户端路由器:如何优化,javascript,backbone.js,backbone-routing,Javascript,Backbone.js,Backbone Routing,我有以下路由配置: routes: { '': 'landing_page', ':show_page': 'show_page', '*actions': 'defaultAction' }, “显示页面”包含一个类似以下内容的函数: show_page: function(page_name){ $.get('php/User/check_session.php', _.bind(function(status) {
routes: {
'': 'landing_page',
':show_page': 'show_page',
'*actions': 'defaultAction'
},
“显示页面”包含一个类似以下内容的函数:
show_page: function(page_name){
$.get('php/User/check_session.php', _.bind(function(status) {
if(status == "yes"){
switch(page_name){
case "home":
var home_View = new Home_View();
app.views.resultView.showView(home_View);
break;
case "parents":
var parent_View = new Parent_View();
app.views.resultView.showView(parent_View);
break;
case "insurers":
var insurer_View = new Insurer_View();
app.views.resultView.showView(insurer_View);
break;
case "new_role":
var new_roles_View = new New_roles_View();
app.views.resultView.showView(new_roles_View);
break;
case "roles_permissions":
var roles_permissions_View = new Roles_permissions_View();
app.views.resultView.showView(roles_permissions_View);
break;
case "user_roles":
var user_roles_View = new User_roles_View();
app.views.resultView.showView(user_roles_View);
break;
case "new_accounting":
var input_accounting_View = new Input_accounting_View();
app.views.resultView.showView(input_accounting_View);
break;
default:
var home_View = new Home_View();
app.views.resultView.showView(home_View);
this.navigate("/home", {trigger:true});
break;
};
etc...
现在的问题是,我想得到的路线如下:
':show_page/:second_parameter': 'show_page_with_parameter'
问题是我可以有条件地管理一切(切换,或者如果……那么):例如,若为父页面,则参数为父id。但若为新角色页面,则参数为角色id。 但是我已经觉得好像我把路由器js文件弄得乱七八糟了
这是做事情的正确方式,还是你会建议我以不同的方式处理 我将去掉switch语句,并在routes对象中显式定义所有路由,这样更容易理解和一眼就能看到所有路由
routes: {
'': 'landingPage',
'home': 'home',
'parents': 'viewParents',
'parents/:id': 'getParents',
...
'*actions': 'defaultAction'
},
除此之外,您的处理程序现在非常简单,但将来可能会更改。大多数人只能使用:
function setView (view, options) {
app.views.resultView.showView(new view(options));
}
通过某种登录验证:
function isLoggedIn() {
return $.get('php/User/check_session.php').then(function (status) {
if (status !== 'yes')
throw new Error('Not logged in');
});
}
或使用视图设置器添加登录验证:
function setAuthenticatedView (View, options) {
return function () {
isLoggedIn().then(function () {
setView(View, options);
});
}
}
总而言之:
permissionsView: setAuthenticatedView(Permissions_view, {}),
parentsView: setAuthenticatedView(Parents_view, {}),
通过这种方式,您可以使用额外的功能扩展路由,而无需使用巨大的switch语句。对于简单路由,您可以轻松阅读源代码并看到,这些都是经过身份验证的视图,它们只是设置了一个简单的主干视图。感谢您提供的有用建议,按照你提出的方式重建我的架构对我来说是有意义的。我不确定是否要显式地设置路径,但似乎更合理的做法是,为每个菜单项确定进一步的路由。非常感谢。