关于[Vue warn]: Duplicate keys detected: ‘1‘. This may cause an update error

 

在vue或小程序的循环中，为保证每一项的独立性，都会使用 key来区分。

对下拉框信息进行循环：

<el-select v-model="form.code" sytle="display: inline-block;" placeholder="请选择电话国家编码">

<el-option

v-for="item in phone"

:key="item.id"

:label="item.name"

:value="item.id">

</el-option>

</el-select>

由于 id 一样， 在 v-for 中 key 一样，造成的问题。修改id后，就不再出现此问题了。

phone: [{

id: 1,

name: '+1 加拿大'

},{

id: 1,

name: '+1 美国'

}],

如果：还是有报错要查看：

 (注意数据是否 正常 id是否重复)

 

1.