Question

所以，我正在尝试使用模板帮助器。

我正在使用帮助程序返回一个类，具体取决于数据库条目。加载模板时它确实可以正常工作，但似乎在数据库条目更改时不会重新运行帮助程序（例如，单击按钮并且事件调用更新方法）。

我希望帮助器在click事件调用update方法时重新运行。

有什么想法吗？

模板：

<template name="modalPost">
  <div id="modalPost" class="modal fade" role="dialog" aria-labelledby="gridSystemModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">

        [...]

    <div class="modal-body">
      <div class="row">
        <div class="col-sm-5">
          <div class="col-xs-12">
            <a href="#" class="upvote btn btn-default {{upvotedClass}}">⬆</a>
            <a href="#" class="downvote btn btn-default {{downvotedClass}}">⇩</a>
          </div>
        </div>
      </div>
    </div>

        [...]

    </div><!-- modal-content -->
  </div><!-- modal-dialog -->
</div><!-- id: bugModal -->

助手：

Template.modalPost.helpers({

 'upvotedClass': function() {
   var userId = Meteor.userId();
   if (userId && !_.include(this.upvoters, userId)) {
     return 'upvotable';
   } else if (userId && _.include(this.upvoters, userId)) {
     return 'btn-success disabled';
   } else {
     return 'disabled';
   }
 },

 'downvotedClass': function() {
   var userId = Meteor.userId();
   if (userId && !_.include(this.downvoters, userId)) {
     return 'downvotable';
   } else if (userId && _.include(this.downvoters, userId))  {
     return 'btn-danger disabled';
   } else {
     return 'disabled';
   }
 }

}）;

活动：

Template.modalPost.events（{

 'click .upvotable': function(e, template) {
   e.preventDefault();
   Meteor.call('upvotePost', this._id);
 },

 'click .downvotable': function(e) {
   e.preventDefault();
   Meteor.call('downvotePost', this._id);
 }

}）;

//可能与问题无关，但为方便起见： - ）

方法：

Meteor.methods({
 'upvotePost': function(post_id){
   var post = Posts.findOne(post_id);
   if (!post) {
     console.log('error, post not found');
   } else if (_.include(post.upvoters, this.userId)) {  // if already upvoted
     console.log('error, already upvoted this post');
   } else if (_.include(post.downvoters, this.userId)) {  // if downvoted before
     Posts.update(post._id, {
       $addToSet: {upvoters: this.userId},
       $pull: {downvoters: this.userId},
       $inc: {votes: 2}
     });
   } else {         // if vote for first time
     Posts.update(post._id, {
       $addToSet: {upvoters: this.userId},
       $pull: {downvoters: this.userId},
       $inc: {votes: 1}
     });
   }
 },

 'downvotePost': function(post_id){
   var post = Posts.findOne(post_id);
   if (!post) {
     console.log('error, post not found');
   } else if (_.include(post.downvoters, this.userId)) { // if already downvoted
     console.log('error, already downvoted this post');
   } else if (_.include(post.upvoters, this.userId)) { // if upvoted before
     Posts.update(post._id, {
       $addToSet: {downvoters: this.userId},
       $pull: {upvoters: this.userId},
       $inc: {votes: -2}
     });
   } else {         // if vote for first time
     Posts.update(post._id, {
       $addToSet: {downvoters: this.userId},
       $inc: {votes: -1}
     });
   }
 }
});

Answer 1

我认为助手中的反应数据源始终是相同的。这就是为什么它不会重新运行。您的被动数据源是Meteor.userId()。您需要其他查询，这将随时间返回不同的结果。或者您可以使用Session或ReactiveVar。

在这里你可以尝试使用反应性Template.currentData（）也许它有帮助。但我没有测试过它。所以在助手中例如：

'upvotedClass': function() {
    var currData = Template.currentData();
    var userId = Meteor.userId();
    if (userId && !_.include(currData.upvoters, userId)) {
        return 'upvotable';
    } else if (userId && _.include(currData.upvoters, userId)) {
        return 'btn-success disabled';
    } else {
        return 'disabled';
    }
}

流星模板助手返回html而不是被动

1 个答案: