Meteor中的自定义列表渲染

Question

我需要将物品显示为情侣。例如，如下所示：

Template.container.couples = function() {
    var items = Items.find({}, {sort: {sort_field: 1}}).fetch();
    var couples = [];
    for (var i = 0; i < items.length; i++) {
        couples.push({
            itemA: items[i],
            itemB: items[i + 1]
        });
        i++;
    }
    return couples;
};

<template name="container">
   <ul>
       {{#each couples}}
           <li>
               <p class="item-a">{{>item itemA}}</p>
               <span>|</span>
               <p class="item-b">{{>item itemB}}</p>
           </li>
       {{/each}}
   <ul>
</template>

<template name="item">
    <strong>{{title}}</strong>
</template>

项目如下所示：

{
   sort_field: 1,
   title: 'Item 1',
   type: 'A'
},
{
   sort_field: 2,
   title: 'Item 2',
   type: 'B'
},
{
   sort_field: 3,
   title: 'Item 3',
   type: 'A'
},
{
   sort_field: 4,
   title: 'Item 4',
   type: 'B'
},
{
   sort_field: 5,
   title: 'Item 5',
   type: 'A'
}

这个代码运行良好，但当我更新其中一个项目的标题时，所有项目都会重新呈现。

如何修复它？如何创建这种具有反应性的布局？

Answer 1

从Meteor 0.8.0开始，Meteor will automagically only re-render content that changes.