更新时流星，反应阵列渲染问题答案

【问题标题】：Meteor, reactive array rendering issues on update更新时流星，反应阵列渲染问题
【发布时间】：2016-05-30 02:45:05
【问题描述】：

我有一个嵌套模板，使用 ReactiveDict 来存储数据，它是一个包含变量（颜色、类型...）和子节点数组的对象。

我在刷新时遇到问题：数组以反应方式显示，但是当我更新数组时，它没有正确呈现。

简而言之（清理代码）：

<body>
{{#with data}}
   {{>nested}}
{{/with}}
</body>

<template name="nested">
<div>{{color}}<div>
<div class="ui dropdown">
<!-- drop down stuff goes here-->
</div>
{{#if children}}
{{#each children}}
   {{>nested scope=this}}
{{/each}}
{{/if}}
</template>

Template.body.helpers({
"data": { color: "blue", 
children: [{color: "green", children: [{color: "teal"}]},
 {color:"red", children:[{color: "cyan"}],{color: "magenta"}]]}}
})

Template.nested.onCreated(function(){
        this.scope          = new ReactiveDict();
        this.scope.set('scope', this.data.scope);
})
Template.nested.helpers({
"color": function () { Template.instance().scope.get('scope').color;},
"children": function () {
        return Template.instance().scope.get('scope').children;
    }
})

Template.nested.events({
"click .ui.dropdown > .menu > .item": function(e, t) {
    e.preventDefault();
    e.stopPropagation();
    var data = t.scope.get('scope');
    //do processing stuff here...
    updatedArray = myFunction();
    data['children'] = updatedArray;
    t.scope.set('scope', data);
}
})

所以发生的情况是，在更新时，已经存在的元素不会更新，如果添加了元素，它们就会显示出来。如果删除了元素，它们的元素将被删除，但变量中的数据（此处为颜色）不会更新。

到目前为止，我必须执行以下操作：

Template.nested.events({
    "click .ui.dropdown > .menu > .item": function(e, t) {
        e.preventDefault();
        e.stopPropagation();
        var data = t.scope.get('scope');
        //do processing stuff here...
        updatedArray = myFunction();
        delete data.children;
        t.scope.set('scope', data);

        Meteor.setTimeout(function() {
             data['children'] = updatedArray;
            t.scope.set('scope', data);
         },10);
    }
    })

这行得通，但它是一种完全的黑客攻击，迫使数组变为空，然后在短暂超时后刷新。

我应该如何以正确的方式做到这一点？ PS：我尝试在ReactiveDict 上使用allDeps.changed()，并尝试强制重新渲染，但它在渲染循环中，因此它不会渲染视图两次。似乎无法理解为什么数组元素没有更新。我知道在使用集合时 MiniMongo 检查对象的 _id 以查看它们是否更改，但我的对象中没有 _id。我也尝试添加一个，但运气不佳

【问题讨论】：

标签： javascript arrays meteor

【解决方案1】：

好吧，我想我在弄清楚之前就问过...... '_id' 事情成功了。我之前尝试过，但实际上我对相同的元素使用了相同的 _id，所以它们似乎没有改变（duh！）

因此，通过在我生成的对象中添加{ "_id": Meteor.uuid() }，更新工作正常。

【讨论】：