突出显示上次插入的流星文档

我在同一页面上有对象的表单和列表。当我插入一个新行时，不容易看到新插入的行的位置。因此，我认为我可以对新插入的行进行着色/突出显示（也许在几秒钟后删除突出显示）。突出显示上次插入的流星文档

我该怎么做？我认为，某种程度上，这可以使用返回插入的ID（return Collection.insert(doc);）在服务器上的方法做的，在客户端上使用与

Meteor.call('insertDoc', function(err,result) { 
    // do something with result 
});

回调，我认为我可以使用reactive-var保存的id最后插入的行和循环突出显示该行与

{{#each docs}} 
    <li class="{{isActive}}">{{name}}</li> 
{{/each}}

，并具有助手回到积极的，如果this._id等于与最后插入的ID无功无功。

但这是最好的方法吗？几秒钟后如何去除颜色？我在许多页面上看到过这样的行为，但我找不到任何教程/代码片段来实现此目的。

来源

2015-07-20 mortensen

为突出显示和淡出：http://stackoverflow.com/问题/ 12814612/CSS3过渡到亮点，新的元素创建合的jQuery – fuzzybabybunny

我写了一个使用流星的UI hooks以淡入淡出列表的项目，因为它们是添加和删除程序包，帮助用户保持上下文数据的变化：

https://github.com/mizzao/meteor-animated-each

有一个演示http://animated-each.meteor.com/。您可以看到，随着项目的添加和删除，它们会淡入淡出。如果项目从屏幕上插入，可见区域不会滚动。

这是不是做你想要什么，但你可以用同样的想法，因为它们出现为好，在相对于简单的褪色，突出项目。

注意，所有这一切都发生在UI渲染级别 - 不是模板/代码级别。 UI挂钩现在也没有很好的记录，但他们已经有一段时间了。

来源

2015-07-21 04:43:16

我不知道你的方法是否最好，但这就是我如何去做的。至于动画，我会使用CSS3动画。有很多可供选择的（https://developer.mozilla.org/en-US/docs/Web/CSS/animation），你可以很容易地使它们淡入标准颜色。该动画也将只适用于最后插入的项目（因为你的方式，只有最后一个项目将有“积极”类）

来源

2015-07-21 11:05:42 CyberClaw

突出显示上次插入的流星文档

回答

相关问题