4

我试图在用户发布的评论的反应性 {{#each}} 中淡入新元素。

我在https://gist.github.com/3119147有一个非常简单的评论部分的代码示例（不包括 textarea 和新评论插入代码，但它非常样板。）。包括我给出的 CSS 片段.comment.fresh { opacity: 0; }，然后在我的脚本中，我有：

Template.individual_comment.postedago_str = function() {
  var id = this._id;
  Meteor.defer(function() {
    $('#commentid_'+id+'.fresh').animate({'opacity':'1'}, function() {
      $(this).removeClass('fresh');
    });
  });
  return new Date(this.time).toString();
};

这似乎是一个执行动画的可怕地方。我的想法是，每次呈现新评论时，都需要调用我的所有Template.individual_comment.*函数，这就是为什么我的动画与其中一个函数不同的原因。Template.individual_comment.postedago_str()但是，每次插入不同的集合（喜欢）时，Meteor 都会调用。这意味着我单击“赞”按钮，我的整个评论列表会闪烁白色并淡入（非常烦人！）。

我阅读了 Meteor 文档并试图弄清楚如何更好地分割我的模板以便只有块会更新，并且我在所有看起来合理的地方添加了 id="" 属性.. 仍然是这个错误。有谁知道发生了什么？

蒂亚！

4

1 回答 1

1

作为一种解决方法，您可以在单个评论{{if}}的类周围包裹一个块fresh，这将检查评论的创建时间，并且fresh如果评论实际上是最近的，则仅首先添加该类。就像是：

<div class="comment{{#if isActuallyFresh}} fresh{{/if}}" id="commentid_{{_id}}">

然后定义 isActuallyFresh 函数：

Template.individual_comment.isActuallyFresh = function() {
  if ((new Date().getTime() - this.time) < 300000) // less than 5 minutes old
     return true;
  else
     return false;
于 2013-02-10T22:54:36.223 回答