Question

我有主应用程序的子应用程序：
main_app
| -mainRouter.js
| -sub_app
| -subAppRouter.js

subAppRouter.js扩展了mainRouter.js。 subAppRouter.js具有路由处理程序（例如/ app1 / item /）。我无法访问subAppRouter 这就是我需要的：
在mainRouter中，我想创建一个路由来处理来自所有应用程序的所有URL。它应该处理路由，进行一些检查，在一种情况下，它应该继续从subAppRouter为该url触发处理程序，否则它应该进行重定向（例如/ app2 / somepage）。

有人可以帮我找到最佳解决方案吗？换句话说：如何通过骨干网中的路由器实现拦截器模式？

由于

Answer 1

我将用点数重新解释你的问题

1-你有一个用于公共路线的主路由器

2-你有一个专门用于某些应用路由的路由器

3-您需要主路由器选择天气来处理将其转发到子路由器的路由

实现这一目标我建议如下

1-创建主路由器，扩展Backbone.Router

var mainRouter = Backbone.Router.extend({
    routes:{
        'index':'loadIndex',
        //other common app routes......
    },
    loadIndex: function(){
        //code to load index
    }
});

2-然后定义app的子路由器，扩展主路由器，但注意如何定义路由

var subAppRouter = mainRouter.extend({
    initialize: function(){
        // here we will extend the base routes to not lose default routing, and add app special routing
        _.extend(this.routes, {
           'subApp/index': 'subAppIndex'
       });
    },
    subAppIndex: function(){
         // code to load sub app index
    },
});

然后你可以使用包含基本路由的子路由器

Answer 2

Here是关于子程序的好文章。这对我来说很完美。

在项目中包含子路径js lib：

<script type="text/javascript" src="backbone.subroute.min.js"></script>

HTML正文示例：

<a href="#app1/">App1</a>
<a href="#app2">App2</a>
<div class="app">
</div>

JS代码示例：

var MyApp = {};
MyApp.App1 = {
    Router: Backbone.SubRoute.extend({
        routes: {
            "": "init",
            "sub1": "sub1"
        },
        init: function  () {
            console.log("app1");
            $(".app").html($("<h1 />", {text: "App1"}));
            $(".app").append($("<a/>", {href: "#app1/sub1", text: "sub1"}));
        },
        sub1: function  () {
            console.log("sub1");
            $(".app").append($("<h2 />", {text: "sub1"}));
        }
    })
};
MyApp.Router = Backbone.Router.extend({
    initialize: function  () {
        if(!MyApp.Routers){
            MyApp.Routers = {};
        }
    },
    routes: {
        "app1/*subroute": "invokeApp1Router",
        "app2": "app2"
    },
    invokeApp1Router: function  (subroute) {
        if(!MyApp.Routers.App1){
            MyApp.Routers.App1 = new MyApp.App1.Router("app1/");
        }               
    },

    app2: function  () {
        console.log("app2");
        $(".app").html($("<h1 />", {text: "App2"}));
    }
});

$(document).ready(function  () {
    new MyApp.Router();
    Backbone.history.start();
})

Backbone.js路由拦截器

2 个答案: