首页 > 编程语言> > javascript – Meteor页面使用Backbone路由器重新渲染

javascript – Meteor页面使用Backbone路由器重新渲染

2019-08-26 04:45:34 作者：互联网

我正在尝试使用Meteor创建一个博客应用程序.在这个博客中有一个主页面,访问者只需阅读帖子,另一个部分是“管理员”面板,我可以在其中编辑帖子.我正在尝试使用车把模板助手,但我不确定我错在哪里.我也是业余开发人员,并试图更好地学习Meteor框架.我的代码是这样的：

blog.html

<head>
  <title>Jeff Lam Tian Hung</title>
</head>

<body>
  <h1>Jeff Lam Tian Hung</h1>
  <a href="/" class="main">Main Page</a>
  <a href="/admin" class="admin">Admin</a>
  {{> content}}
</body>

<template name="content">
  {{#if currentPage "blog"}}
    {{#each posts}}
      <h2>{{Title}}</h2>
      <p>{{Body}}</p>
    {{/each}}
  {{/if}}

  {{#if currentPage "admin"}}
    <h2>{{admin}}</h2>
  {{/if}}
</template>

blog.js

// Declaration of Collections
Posts = new Meteor.Collection("Posts");

// Helper variable is for pages
// TODO: changing this var will change the
// page but now how to rerender the page?
var page = "blog";

// Declaration of Template Reactivity Variables
Template.content.currentPage = function (type) {
  return page === type;
};
Template.content.posts = function () {
  return Posts.find({}, {sort: {Date: 1}});
};
Template.content.admin = function () {
  return "This will render admin section";
};

// Router for Pages
var Router = Backbone.Router.extend({
  routes: {
    "":      "main",
    "admin": "admin"
  },
  main: function () {
    page = "blog";
  },
  admin: function () {
    page = "admin";
  }
});

var BlogRouter = new Router;

Meteor.startup(function () {
  Backbone.history.start({pushState: true});
});

publish.js(仅限服务器端代码)

Posts = new Meteor.Collection("Posts");

该页面将使用上面的代码呈现博客帖子,但是当我访问localhost：3000 / admin时,页面变量被设置为’admin’作为编码,但页面/模板不会重新呈现自己以显示’Admin ‘文字.

但是,如果我要设置var page =’admin’并刷新应用程序,该页面会重新呈现管理员消息.我不确定我是否正确使用把手模板助手进行这种“带路由的单页模板刷新”.谢谢你的帮助！

解决方法:

您的变量“page”不是被动的,只是一个普通的JavaScript变量.它没有办法通知Meteor变化.

当我开始使用Meteor时,为了类似的目的,我将页面“代码”放入Session变量中,这将触发您的页面更新.例如：

// Declaration of Template Reactivity Variables
Template.content.currentPage = function (type) {
    return Session.equals("page", type);
};

在你的路由器中：

...
Session.set("page", "admin");
…

(虽然你可能想把Session.set位放在它自己的函数中)

因为会话变量在Meteor框架中是被动的,并且会在更改时通知.

标签：html,javascript,meteor,handlebars-js,javascript-framework
来源： https://codeday.me/bug/20190826/1726024.html