流星铁路由器基本示例。走不了路答案

【问题标题】：meteor iron router basic example. Can't make it route流星铁路由器基本示例。走不了路
【发布时间】：2014-10-24 00:15:31
【问题描述】：

我只是创建了一个流星项目并从示例“基本”文件（位于https://github.com/EventedMind/iron-router/tree/devel/examples/basic）中复制/粘贴替换流星项目的 .html 和 .js 文件。

在 HTML 中，示例未能包含任何模板，因此我添加了 {{> Home}} 并在“body”块之间运行 Meteor。

<body>
 {{> Home}}
</body>

完整的 HTML 代码是：基本的

<body>
{{> Home}}
</body>

<template name="Home">
  <h1>Home</h1>
    {{> Nav}}
  <p>
    Data Title: {{title}}
  </p>
</template>

<template name="One">
  <h1>Page One</h1>
   {{> Nav}}
</template>

<template name="Two">
  {{> Nav}}

  <h1>Page Two</h1>
</template>

 <template name="Nav">
  <ul>
    <li>
  <a href="/">Home</a>
    </li>
    <li>
  <a href="/One">Page One</a>
</li>
<li>
  <a href="/Two">Page Two</a>
    </li>
  </ul>
</template>

.js 代码与示例完全相同。

但是，在运行时，它无法更改或路由到第一页和第二页。它只是停留在主页上。

我正在学习使用它，但即使是最简单的示例，我似乎也无法正确使用它。我做错了什么？

【问题讨论】：

标签： meteor iron-router

【解决方案1】：

Router.map 现在已被Router.route 弃用并取而代之，但是，他们似乎仍在解决一些错误。首先，我发现他们的基本路由功能目前很少起作用，所以暂时不要使用它，即：

Router.route('/path', function() {
  this.render('pathName');
});

这是由于兼容性问题还是其他原因，我不知道。我找到了一个非常标准的公式，但它似乎工作得很好，那就是用内置的“路由特定选项”替换函数，并准确指定你想要的，就像使用基本 JSON 一样：

Router.route('/path', {
  name: 'pathName',
  path: '/path',
  template: 'templateName',
  data: function () {
    title: 'My Title'
  }
});

注意 path: 选项。这应该不是必需的，因为路径被定义为 Router 函数的第一个参数，但它们在文档中明确说明您可能需要包含路径：在您的路由中以实现向后兼容性。我敢肯定，一旦他们让一切顺利运行，您就可以完全删除它。

此外，如果 templateName 与您的 /path 相同，则不需要 template: 选项（就此而言，如果 pathName: 选项也与您的 /path 相同，则不需要该选项），但是我发现包含它们只会让生活更轻松，因为有时它们无法正常运行。

简而言之，当bug消失后，像你这样的简单模板将被调用一行：

Router.route('/one');

最终结果是他们简化了路由的调用和定义方式，但不幸的是，目前它似乎并没有按计划工作。我希望这可以帮助您现在了解 Router.map 和 Router.route 之间的区别。

另外，您之前代码的主要问题是您在 body 标记之间插入了部分 {{> Home}}，这不是必需的，而且会搞砸，因为即使流星试图在其他模板之间路由并加载其他模板。本质上，当 Meteor 加载模板“One”时，它必须在模板“Home”之上加载，这意味着您需要同时加载两个 {{> Nav}} 部分。

【讨论】：

亲爱的耶利米，我想你成功了。 Router.route 现在适用于您的建议。我永远也想不通，特别是作为一个新人。但是，我注意到“我的标题”数据没有出现，也没有显示在页面上。这可能是另一个错误吗？
这是一个很好的链接，可帮助您了解数据上下文及其操作方式：discovermeteor.com/blog/…

【解决方案2】：

当使用 iron router 包时，你必须保留 body 标签，或者根本不包含它，我使用的是布局模板，但它不是必需的：

basic.html：

<head>
    <title>basic</title>
</head>

<body>
</body>

<template name="layout">
    {{> yield}} 
</template>

<template name="Home">
    {{> Nav}}

    <h1>Home</h1>

    <p>
        Data Title: {{title}}
    </p>
</template>

<template name="One">
    {{> Nav}}

    <h1>Page One</h1>
</template>

<template name="Two">
    {{> Nav}}

 <h1>Page Two</h1>
</template>

<template name="Nav">
    <ul>
        <li>
            <a href="/">Home</a>
        </li>
        <li>
            <a href="/one">Page One</a>
        </li>
        <li>
            <a href="/two">Page Two</a>
        </li>
    </ul>
</template>

basic.js：

Router.configure({
    layoutTemplate: 'layout'
});

Router.map(function(){
    this.route('Home', {path: '/', data: {title: 'My title'}});
    this.route('One');
    this.route('Two');
});

现在可以正常工作了。

【讨论】：

嗨，Chreyes。谢谢！当我从示例中的“Router.route”更改为代码中的 Route.map 时，它起作用了。哪一个是对的？但是，它不会呈现页面一和二。我们可以看到它在那里路由，但页面显示完全空白。
嗨，Chreyes。忘记我的最后评论......犯了一个愚蠢的错误，现在它工作得很好！非常感谢！！！我将尝试缩小 Route.map 和 Route.router 之间的区别。您的支持对我帮助很大！
Soory.. 我不能投票。需要提高声誉。
地图函数说：在这种情况下将Router.map(function(){ this.route('Home', {path: '/'});});转换为Router.route('Home', {path: '/'});。