解决Vue项目中Emitted value instead of an instance of Error问题
作者:努力向前,成长可见
这篇文章主要介绍了解决Vue项目中Emitted value instead of an instance of Error问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
Vue项目Emitted value instead of an instance of Error
对于一个初次进行项目开发的小白来说,项目开发的过程中可能会遇到这样的问题:
这个警告的意思是用v-for呈现的组件列表需要具有显式键。
出现这个警告的原因
是在Vue中当使用v-for进行列表渲染时,虚拟dom和实际dom不一样,不能做唯一性,为元素绑定一个key,可以确保唯一性操作。
这也是Vue官方推荐的做法。
针对上述问题的解决方法
在警告的组件里v-for后面加一个属性key,即为生成的每一个元素绑定一个key,这样就可以了。
如下边代码所示:
<mt-tab-container v-model="selected"> <mt-tab-container-item id="1" > <mt-cell v-for="n in 10" :title="'内容 ' + n" :key="n"/> </mt-tab-container-item> <mt-tab-container-item id="2"> <mt-cell v-for="n in 4" :title="'测试 ' + n" :key="n"/> </mt-tab-container-item> <mt-tab-container-item id="3"> <mt-cell v-for="n in 6" :title="'选项 ' + n" :key="n"/> </mt-tab-container-item> </mt-tab-container>
总结
以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。