如何在 ember.js 中使用多个路由器对象

Question

我还是 ember.js 的新手，但我还没有大规模看到框架的一部分是基本的 Ember 路由器。在一个小型单页应用程序中，您只有一个路由器来管理所有状态/路由等。但是随着您的应用程序的增长，如果该模式似乎只关注一个对象，您如何管理复杂性？

很好奇这是否只是我忽略的东西，或者这是否被认为是一个庞大的全局状态管理对象，例如 iOS 中的 AppDelegate。

Answer 1

我不知道我的方式是否是普遍接受的最佳实践，但我知道当路由器变大时应该将其拆分为多个文件。我是这样完成的：

app_router.js

App.Router = Ember.Router.extend({
  enableLogging: true,
  root: Ember.Route.extend({
    route: '/',
    index: Ember.Route.extend({
      route: '/',
      redirectsTo: 'app.index'
    }),
    app: Ember.Route.extend({
      route: '/app',
      showProfile: Ember.Route.transitionTo("user.index"),
      index: Ember.Route.extend({
        route: '/',
        redirectsTo: 'items'
      }),
      items: App.ItemsRoute,
      item: App.ItemRoute,
      users: App.UsersRoute,
      user: App.UserRoute,
      hashtagbrand: App.HashtagbrandRoute
    })
  })
});

items_router.js

App.ItemsRoute = Ember.Route.extend({
  route: '/items',
  connectOutlets: function(router, items) {
    router.get("applicationController").connectOutlet({
      name: 'carouselContainer',
      outletName: 'carousel',
      context: App.store.find(App.Item)
    });
    router.get("applicationController").connectOutlet({
      name: 'logo',
      outletName: 'header'
    });
  },
  index: Ember.Route.extend({
    route: '/'
  })
}); 


App.ItemRoute = Ember.Route.extend({
  route: '/items/:id',
  //...
  index: Ember.Route.extend({
    route: '/'
    //...
  })
});