Vue v-for loops an array. The key value reports an error, but the data is displayed normally.
A carousel component loops an array of pictures. This data can be displayed normally in the carousel chart, but there is an error report that is not clear.
<swiper :options="swiperOption" class="swiper-box">
<swiper-slide class="swiper-item" v-for="item in srcList" key="item">
<img :src="item.src" alt="...">
</swiper-slide>
<div class="swiper-pagination" slot="pagination"></div>
</swiper>
there are also wavy lines in the editor:
import
you can't write this key like this, should you add: Ah
<swiper :options="swiperOption" class="swiper-box">
<swiper-slide class="swiper-item" v-for="item in srcList" :key="item">
<img :src="item.src" alt="...">
</swiper-slide>
<div class="swiper-pagination" slot="pagination"></div>
</swiper>
the wavy line should be: key = "item". Try it.
the object you passed to key is {}, not a string. If the item does not have a unique identification field, then the key is removed, and there should be no problem if you do not have to pass a value.
if you make a mistake, you need to add before key : key
v-for using key,: key;
srcList is an array, and item, whose key value cannot be of data type Object should bind the next attribute of item object. This attribute cannot be repeated, otherwise an error will still occur. You can change it to "(item,index) in srcList": key= "index"), the index in the index object array. It will not repeat and will not report two problems
. First, the main city key is added before: key,. Secondly, the key binds the index and the single field of the id class, and the object is also prone to problems. It is recommended to standardize the format of v-for when using vmurfort = "(item,index) in Array": key= "index"
).
