2017-03-16 59 views
1

我正在VueJS中制作组件的递归树。我有这种线在我项目组件:在VueJS中递归使用组件时得到警告

<item v-for="i in items" v-model="i"></item> 

它工作正常,但Vue公司是给我这样的警告:

您直接结合的V型向V型的迭代别名。这将使 无法修改v-for源数组,因为写入 别名就像修改函数局部变量一样。考虑使用 对象数组,并改为在对象属性上使用v-model。

我对这个警告感到困惑,因为我的应用似乎工作正常 - 我可以添加,移动和删除我的项目树中的节点就好。这个错误信息是怎么回事 - 我应该担心吗?

回答

0

错误是说参数i的更改通过,因为您的<item>组件的v-model不会反映在items属性中。这是因为i只是该项目的别名,而不是实际的项目。

如果您不需要items更新每个<item>组件的型号更改时,那么您不必担心。但是您可能希望items更新,因为您将项目中的每个元素都作为v-model传递。

为了正确引用每个项目并避免此警告,可以使用索引访问items数组中的每个元素。像这样:

<item v-for="(item, index) in items" v-model="items[index]"></item> 
0

你应该担心,因为你将无法使用i结合在其他情况下的模型,如观察,或过滤器等

这不是一个很好的做法,该警告是有效的。

请考虑在您的data中创建一个数组,并将其作为对象添加到对象,然后执行v-for和绑定。它更安全。

我之前有过类似的警告,我无法处理变量,因为它们被认为是本地警告