vue中解決v-for使用報紅並出現警告

這次帶給大家vue中解決v-for使用報紅並出現警告，的vue中解決v-for使用報紅並出現警告注意事項有哪些，以下就是實戰案例，一起來看一下。

程式碼回報對於追求優美程式碼的強迫症患者來說看著很不舒服，報紅如下：

控制台中也會有：

(Emitted value instead of an instance of Error) <Option v-for="item in searchTypeList">: component lists rendered with v-for should have explicit keys. See https://vuejs.org/guide/list.html#key for more info.

這樣的提示，解決這個報紅的問題，我們要根據他的提示，循環的時候加入一個唯一的key，這裡選擇使用index：

<ul 
class="clearfix course-list">
<li 
class="left" 
v-for="(item,index)
in gradeClassfy.primary.grade"
:key="index"><a
href="#" rel="external nofollow" >{{item.name}}</a></li>
</ul>

如此，報紅消失。

以上這篇基於vue中解決v-for使用報紅並出現警告的問題就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

推薦閱讀：

Vue.directive()的圖文詳解

##JsChart的元件使用詳解
#

以上是vue中解決v-for使用報紅並出現警告的詳細內容。更多資訊請關注PHP中文網其他相關文章！