Question

我正在尝试在Meteor中使用非常基本的东西，当用户单击按钮时，会调用Session.set（）然后显示div。问题是，如果我不调用Session.set（），则行为与预期一样，单击按钮时显示div。但是，一旦我包含Session.set（），我需要在消息实际显示之前单击两次。要确保可以重现行为，请确保页面是干净的负载而不是Meteor刷新！ HTML的代码是：

<head>
  <title>test</title>
</head>
<body>
  {{> home}}
</body>

<template name="home">
  <div>
    <input type="button" id="addButton" value="add">
  </div>
  {{> popup}}
</template>

<template name="popup">
  {{#with messageHelper}}
  <div id="messageDiv" style="display: none">
    message is {{message}}
  </div>
{{/with}}
</template>

这是Javascript，让它打勾。

Template.home.events({
  'click #addButton': function(){
    // **** if this line is commented out, it will work
    Session.set("messageHelper", {message: 'HERE'});
    // ****
    $('#messageDiv').show();
  }
});

Template.popup.helpers({
  messageHelper: function(){
    return Session.get("messageHelper");
  }
});

Answer 1

我认为更改的会话变量会以原始状态重新呈现模板，设置style =“display：none”。讨论了这个问题here。解决方案是重新组织模板，因此反应性不在切换显示的模板中。

更简单的解决方案可能只是使用把手#if帮助器在有消息时显示模板：

<template name="popup">
   {{#with messageHelper}}
     {{#if message}}
       <div id="messageDiv">
         message is {{message}}
       </div>
     {{/if}}
   {{/with}}
</template>

然后在事件处理程序中不需要.show（）。

Meteor在一次调用中结合了Session.set和jQuery

1 个答案: