流星使用主干路由总是加载一条路由

我希望能深入了解这是否是一种"正确"的做事方式，以及是什么导致了我所看到的错误。

我已经添加了主干到我的基础流星安装meteor add backbone

然后我设置一个router.js文件如下(仅显示2页作为示例);

var Router = Backbone.Router.extend({
  routes: {
    "":                 "index", 
    "help":             "help",  
    ... 
  },
  index: function() {
    Session.set('currentPage', 'homePage');
  },
  login: function() {
    Session.set('currentPage', 'loginPage');
  },
  ...

然后对于页面，我有html文件的模板看起来像这样…

<template name="homepage">
    {{#if route}}
    You're at the Home Page!
    {{/if}}
</template>

对于主页，我有一个包含以下内容的html文件;

<body> 
...
    {{> homepage}}
    {{> loginpage}} 
    {{> helppage}}
...
</body>

这适用于所有的页面，除了一个指定的"主页"，这个模板是总是呈现，无论我在哪里的网站。例如，myapp/作为根页面只显示主页模板，但myapp/loginpage显示loginpage模板和主页模板。因此，每个单独的页面都显示了主页模板的竞赛。

见解吗?(或更好的结构方式)。

谢谢

终于有一个我可以回答的问题了，因为这是我过去几个月来每周工作60个小时的事情:-P

你在这里做错了一些事情，它们是非常简单的修复，会让你立即启动。

的第一件事

你需要实例化所有的路由器，然后初始化Backbone.pushState()。

// This is just how I have been doing it, there are many correct ways.
var LoadedRouters = {
    Module1 : new Module1Router(),
    Module2 : new Module2Router(),
    ...
};
// After all routes instantiated, we tell Backbone to start listening.
Backbone.history.start({ pushState : true, root : "/" });

这是非常重要的，你设置root属性正确，否则奇怪的事情开始发生。

的第二件事

你必须列出你的路由器，从最特定到最不特定，自上而下。上面概述的URL结构将始终匹配第一个路由并触发它。

routes : {
    "help/phones/newservice" : HandleNewServiceHelp(),
    "help/phones/oldservice" : HandleOldServiceHelp(),
    "help/phones(/:any)" : HandleAllPhoneHelp(),
    "help(/:any)" : HandleAllHelp(),
    "" : HandleAllUnmatchedRoutes()
};

Backbone.router可能是一件棘手的事情。

相关内容

最新更新

热门标签：