流星图像不会显示在每个页面上

我创建了这个网站：pictionary6470.meteor.com 使用meteor。图像徽标仅显示在主页上，但不显示在游戏页面上（在您登录并开始继续游戏后）。

我使用路由器创建了两个页面。我将图像包含在我的模板中，并在两个页面上使用相同的代码包含模板。

在 HTML 中：

<body>
{{> nav}}
</body>

我把导航模板放在主页.html，并在游戏中引用它.html。

<div class="container">
  <a href="/" class="brand-logo"><img src="icon.png" height="50" width="350"/></a>
  <ul id="nav-mobile" class="right side-nav">
    <li>{{>loginButtons}}</li>
    {{#if currentUser}} 
    {{/if}}
  </ul>
</div>

我遇到的另一个问题是，当它路由器到不同的页面时，它会闪烁一次然后到达目标页面。有人知道为什么吗？

首先添加铁路由器包。

meteor add iron:router

其次，让我们在新布局模板上使用{{> yield}} 、帮助程序

 <template name="layout">
    <a href="/" class="brand-logo"><img src="icon.png" height="50" width="350"/></a>
   <div>
      {{> yield}}
   </div>
    </template>

现在在里面的新文件上lib/routes.js添加新代码。

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

对于那个闪光的东西，让我们添加一个加载模板

首先添加meteor add sacha:spin

并创建一个这样的新模板

<template name="load">
{{> spinner}}
</template>

您需要了解，我们都调用了布局模板的所有内容，并将其放置在 {{> yield}} 帮助程序中。因此，收益助手之外的任何内容都将在所有网页上提供。

有关{{>yield}}及其工作原理的更多信息，请查看此处

你试过这个吗？

<img src="/icon.png" height="50" width="350"/>

相关内容

最新更新

热门标签：