Javascript 单击按钮时Meteor显示/隐藏元素

我有这样一个模板：

<template name="Menus">
  <button class="btn_create new_menu_toggle"><i class="fa fa-plus"></i> Create a new menu</button>
  <button class="btn_cancel new_menu_toggle"><i class="fa fa-times"></i> Cancel</button>
  {{> NewMenu}}
</template>

创建一个新菜单
取消
{{>NewMenu}}

我试图实现的是，最初只显示

btn\u create

。如果按下

.btn\u create

，则呈现

{{>NewMenu}

，并将

.btn\u create

替换为

btn\u deny

。对于

btn\u deny

的行为，反之亦然

---

如何在Meteor中实现这一点我知道我可能可以通过在vanilla Javascript中添加/更改类来实现，但我想知道是否有更简单的方法使用Meteor/Blaze。

一个简单的模式是使用会话变量跟踪状态

html:

呈现模板时，需要初始化会话变量：

Template.Menus.onRendered(function(){
  session.set('createMode',true);
});

最后，您需要模板可用于空格键条件表达式的辅助对象：

Template.Menus.helpers({
  createMode(){
    return session.get('createMode');
  }
});

---

一种简单的模式是使用会话变量来跟踪状态

html:

呈现模板时，需要初始化会话变量：

Template.Menus.onRendered(function(){
  session.set('createMode',true);
});

最后，您需要模板可用于空格键条件表达式的辅助对象：

Template.Menus.helpers({
  createMode(){
    return session.get('createMode');
  }
});