Vue项目,使用v-for遍历变量,报错:component lists rendered with v-for should have explicit keys
Vue项目使用v-for遍历变量,报错:component lists rendered with v-for should have explicit keys 的解决办法操作环境出错的前端代码报错信息原因和解决办法原因解决办法参考资料操作环境WebStorm + Vue + Element UI出错的前端代码<el-tag style="margin: 1px 2px;"v...
·
Vue项目使用v-for遍历变量,报错:component lists rendered with v-for should have explicit keys 的解决办法
操作环境
WebStorm + Vue + Element UI
出错的前端代码
<el-tag style="margin: 1px 2px;"
v-for="(r,indexj) in hr.roles"
type="success">{{r.namezh}}
</el-tag>
报错信息
(Emitted value instead of an instance of Error) :
component lists rendered with v-for should have explicit keys.
See https://vuejs.org/guide/list.html#key for more info.
原因和解决办法
原因
v-for 必须配置 :key
解决办法
把代码改成:
<el-tag style="margin: 1px 2px;"
v-for="(r,indexj) in hr.roles" :key="indexj"
type="success">{{r.namezh}}
</el-tag>
参考资料
更多推荐
已为社区贡献2条内容
所有评论(0)