【问题标题】:Meteor using backbone for routing always loading one routeMeteor 使用骨干路由总是加载一个路由
【发布时间】:2013-05-06 09:33:10
【问题描述】:

如果您能深入了解这是否是一种“正确”的做事方式,以及导致我看到的错误的原因,我将不胜感激。

我已将骨干添加到我的基础流星安装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 显示登录页面模板和主页模板。所以每一页都显示首页模板的较量。

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

谢谢

【问题讨论】:

  • 在输入所有内容并考虑之后,我想这是因为“”与我网站的根 url 匹配,因此它返回您在“索引”页面上无论如何您在网站上的位置。如果是这样的话,有没有办法解决这个问题?我本来可以想象将会话变量设置为不'homePage'应该可以解决这个问题。
  • 您可能必须在主干历史记录开始中定义您的初始/基本 url。看这个问题的答案stackoverflow.com/questions/9368151/…

标签: backbone.js meteor


【解决方案1】:

最后一个我可以回答的问题,因为这是我过去几个月每周工作 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 学习起来可能很棘手。

【讨论】:

  • 那么,第一件事和第二件事,凯特做了什么?
  • 在大多数情况下,是的。 Second Thing 中的代码 sn-p 只是路由器匹配的路由的映射,并表示它所在的任何路由器的 Router.routes 属性。该路由器还包含函数HandleNewServiceHelpHandleOldServiceHelpHandleAllPhoneHelpHandleAllHelpHandleAllUnmatchedRoutes。在routes 映射内作为路由操作提供的所有方法都需要在同一路由器内具有同名函数。 这些功能不会映射到路由器之外的功能。(我认为。)
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2012-11-10
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多