Javascript Meteor，更新时的反应性阵列渲染问题_Javascript_Arrays_Meteor

Javascript Meteor，更新时的反应性阵列渲染问题

javascript arrays meteor

Javascript Meteor，更新时的反应性阵列渲染问题,javascript,arrays,meteor,Javascript,Arrays,Meteor,我有一个嵌套的模板，使用一个ReactiveDict来存储数据，它是一个包含变量（颜色、类型…）和子节点数组的对象我在刷新时遇到了一个问题：数组以反应方式显示，但当我更新数组时，它无法正确渲染简而言之（清除代码）：这是可行的，但这完全是一种黑客行为，它强制数组为空，然后在短时间超时后刷新我该怎么做才对呢？ PS：我尝试在ReactiveDict上使用allDeps.changed（），并尝试强制重新渲染，但它位于渲染循环中，因此不会渲染视图两次。似乎无法理解为什么数组元素没有更新。我知

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

我在刷新时遇到了一个问题：数组以反应方式显示，但当我更新数组时，它无法正确渲染

简而言之（清除代码）：

这是可行的，但这完全是一种黑客行为，它强制数组为空，然后在短时间超时后刷新

我该怎么做才对呢？ PS：我尝试在

ReactiveDict

上使用

allDeps.changed（）

，并尝试强制重新渲染，但它位于渲染循环中，因此不会渲染视图两次。

似乎无法理解为什么数组元素没有更新。我知道当使用collections MiniMongo时，会检查对象的_id以查看它们是否更改，但我的对象中没有_id。我也试着添加一个，但运气不太好

嗯，我想我是在弄明白之前问的。。。 “身份”的事情起了作用。我以前试过，但实际上我对相同的元素使用了相同的_id，所以它们看起来没有变化（duh！）

因此，通过在我生成的对象中添加

{“\u id”：Meteor.uuid（）}

，更新工作正常

<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);
    }
    })