v-for不能更新迭代器本身

v-for不能更新迭代器本身

问题代码：

<template>
    <Card ref="processnode"
            v-for="(processNode, index) in processNodeList"
            :key="index"
            :index="index"
            :departPersonnel="departPersonnel"
            :processNode.sync="processNode"
            @pop-node="removeNode" />
</template>

描述：在使用v-for的时候循环Card组件时，使用了.sync语法糖，就是子组件双向绑定父组件的数据。那么，我将processNodeList的子项（元素）processNode传给子组件，这时就报出了下面的错误：

‘v-model‘ directives cannot update the iteration variable ‘item‘ itself.

解决方法：

不要将数组的元素也就是processNodeList的子项（元素），直接通过.sync绑定传给子组件，而是通过数组的下标获取到对应的子项（元素）再通过.sync绑定传给子组件。

<template>
    <Card ref="processnode"
            v-for="(processNode, index) in processNodeList"
            :key="index"
            :index="index"
            :departPersonnel="departPersonnel"
            :processNode.sync="processNodeList[index]"
            @pop-node="removeNode" />
</template>

出现问题处解决前后对比：

前	后
:processNode.sync="processNode"	:processNode.sync="processNodeList[index]"