如何在 Backbone 路由器中设置路由别名?
How to do a route alias within a Backbone Router?
有一条像 'dogs': 'process'
这样的路线,我需要将其重写为 'animals': 'process'
。
现在,我需要路由器识别两条路由,但总是显示 url 就像 /animals
,这是一种别名,但找不到任何关于如何解决这个问题的信息在 'process'
处理程序中放置 url 重定向。
我假设对别名的真正需求与 dogs
到 animals
不同,所以无论 use-case 这里是否存在,我都会回答好不好。但是,如果您不想更改哈希值,而是想在应用程序中触发不同的行为,那么使用路由器可能不是正确的选择。
路由别名在 Backbone 中并不存在,除了使用相同的回调定义不同的路由。根据您的确切 use-case,有多种方法可以处理类似的路线。
替换哈希
要为来自不同路由的通用路由显示相同的哈希值,请使用 navigate
function 的 replace
选项。
routes: {
'lions': 'animalsRoute',
'animals': 'animalsRoute'
},
animalsRoute: function() {
this.navigate("#/animals", { replace: true });
// or using the global history object:
// Backbone.history.navigate("#/animals", { replace: true });
}
然后处理 animals 路由,无论最初使用哪个路由进入此回调。
其他一些答案或教程会说要使用 window.location.hash
但不要这样做。无论如何,手动重置哈希都会触发路由,并且可能会造成更多麻烦而不是帮助。
行为不同但路线相同
只需使用不同的回调,都使用上面的替换技巧。
routes: {
'lions': 'lionsRoute',
'tigers': 'tigersRoute'
},
showGenericRoute: function() {
this.navigate("#/animals", { replace: true });
},
tigersRoute: function() {
this.showGenericRoute();
// handle the tigers route
},
lionsRoute: function() {
this.showGenericRoute();
// handle the lions route
}
注意不存在的 animalsRoute
。如果没有选择特定的动物,如果有一般行为,您可以添加路线。
使用路由参数
如果您想知道选择了哪种动物但仍使用相同的回调并从哈希中删除所选动物,请使用 route params.
routes: {
'animals/:animal': 'animalsRoute',
},
animalsRoute: function(animal) {
// removes the animal from the url.
this.navigate("#/animals", { replace: true });
// use the chosen animal
var view = new AnimalView({ type: animal });
}
重定向到通用路由
如果您想要不同的行为但始终显示相同的路由,请使用不同的回调,然后重定向。如果通用路由在另一个路由器实例中,这将很有用。
var Router = Backbone.Router.extend({
routes: {
'animals': 'animalsRoute'
},
animalsRoute: function() {
// handle the generic behavior.
}
});
var PussyRouter = Backbone.Router.extend({
routes: {
'lions': 'lionsRoute'
// ...
},
lionsRoute: function() {
// handle lions, then redirect
this.navigate("#/animals", { trigger: true, replace: true });
}
});
使用 trigger
选项将在另一个路由器中调用 animalsRoute
并且 replace
选项将避免在历史记录中进行输入,因此按下后退按钮不会前往 lions
返回 animals
并被困在动物路线上。
有一条像 'dogs': 'process'
这样的路线,我需要将其重写为 'animals': 'process'
。
现在,我需要路由器识别两条路由,但总是显示 url 就像 /animals
,这是一种别名,但找不到任何关于如何解决这个问题的信息在 'process'
处理程序中放置 url 重定向。
我假设对别名的真正需求与 dogs
到 animals
不同,所以无论 use-case 这里是否存在,我都会回答好不好。但是,如果您不想更改哈希值,而是想在应用程序中触发不同的行为,那么使用路由器可能不是正确的选择。
路由别名在 Backbone 中并不存在,除了使用相同的回调定义不同的路由。根据您的确切 use-case,有多种方法可以处理类似的路线。
替换哈希
要为来自不同路由的通用路由显示相同的哈希值,请使用 navigate
function 的 replace
选项。
routes: {
'lions': 'animalsRoute',
'animals': 'animalsRoute'
},
animalsRoute: function() {
this.navigate("#/animals", { replace: true });
// or using the global history object:
// Backbone.history.navigate("#/animals", { replace: true });
}
然后处理 animals 路由,无论最初使用哪个路由进入此回调。
其他一些答案或教程会说要使用 window.location.hash
但不要这样做。无论如何,手动重置哈希都会触发路由,并且可能会造成更多麻烦而不是帮助。
行为不同但路线相同
只需使用不同的回调,都使用上面的替换技巧。
routes: {
'lions': 'lionsRoute',
'tigers': 'tigersRoute'
},
showGenericRoute: function() {
this.navigate("#/animals", { replace: true });
},
tigersRoute: function() {
this.showGenericRoute();
// handle the tigers route
},
lionsRoute: function() {
this.showGenericRoute();
// handle the lions route
}
注意不存在的 animalsRoute
。如果没有选择特定的动物,如果有一般行为,您可以添加路线。
使用路由参数
如果您想知道选择了哪种动物但仍使用相同的回调并从哈希中删除所选动物,请使用 route params.
routes: {
'animals/:animal': 'animalsRoute',
},
animalsRoute: function(animal) {
// removes the animal from the url.
this.navigate("#/animals", { replace: true });
// use the chosen animal
var view = new AnimalView({ type: animal });
}
重定向到通用路由
如果您想要不同的行为但始终显示相同的路由,请使用不同的回调,然后重定向。如果通用路由在另一个路由器实例中,这将很有用。
var Router = Backbone.Router.extend({
routes: {
'animals': 'animalsRoute'
},
animalsRoute: function() {
// handle the generic behavior.
}
});
var PussyRouter = Backbone.Router.extend({
routes: {
'lions': 'lionsRoute'
// ...
},
lionsRoute: function() {
// handle lions, then redirect
this.navigate("#/animals", { trigger: true, replace: true });
}
});
使用 trigger
选项将在另一个路由器中调用 animalsRoute
并且 replace
选项将避免在历史记录中进行输入,因此按下后退按钮不会前往 lions
返回 animals
并被困在动物路线上。