使用Meteor会话来切换模板

Question

使用Meteor会话来切换模板

3

我是JavaScript和Meteor的新手，正在尝试创建编辑功能，以便能够修改列表项的属性（来自Mongo文档）。如果我将editMode设置为项目本身的布尔属性，则可以使其正常工作，但我希望它是本地和临时的，而不是与文档一起存储。

看下面的代码，您会注意到我还是个新手，还不完全理解自己在做什么，但您应该能够理解我想要做什么 :)

代码有些问题，但我正在尝试基于切换编辑按钮来连接会话中的更改，以获取编辑模式模板进行渲染。这是我拥有的内容（剥离了相关内容）：

// Item template

<template name="item">
  <div class="item">
    <span>{{itemText}}</span>
    <span class="glyphicon glyphicon-pencil item-edit" aria-hidden="true"></span>
  </div>
  <div class="mod-table">
    {{#if this.editMode}}
      {{> modTable}}
    {{/if}}
  </div>
</template>

// Associated .js file

Session.set(this.editMode, false);

Template.item.events({
  'click .item-edit': function() {
    if (this.editMode) {
      Session.set(this.editMode, false);
    } else {
      Session.set(this.editMode, true);
    }
  }
});

- Erik Johnson

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- saimeunt · Accepted Answer

不要使用Session变量，因为它们是全局的，被认为是不好的做法，你应该使用与你的项模板关联的ReactiveVar。

item.html:

<template name="item">
  <div class="item">
    <span>{{itemText}}</span>
    <span class="glyphicon glyphicon-pencil item-edit" aria-hidden="true"></span>
  </div>
  <div class="mod-table">
    {{#if editMode}}
      {{> modTable}}
    {{/if}}
  </div>
</template>

item.js :

Template.item.created=function(){
  this.editMode=new ReactiveVar(false);
};

Template.item.helpers({
  editMode:function(){
    return Template.instance().editMode.get();
  }
});

Template.item.events({
  'click .item-edit': function(event,template) {
    var editMode=template.editMode.get();
    template.editMode.set(!editMode);
  }
});

不要忘记在您的项目中添加meteor add reactive-var！