vue项目中报错:Avoid using non-primitive value as key, use string/number value instead.
Avoid using non-primitive value as key, use string/number value instead.
意思是:避免使用非基本值作为键,而是使用字符串/数字值。
Duplicate keys detected: '[object Object]'. This may cause an update error.
意思是:检测到重复键:'[object object]'。这可能会导致更新错误。
主要问题出现在:v-for 遍历 :key = obj :key 给了一个obj对象 ,改为字符串或数字即可解决:
代码
<a-table :columns="columns" :data-source="data" bordered size="middle" :pagination="pagination"> <!-- 插槽 --> <!-- <template slot="footer" slot-scope="currentPageData"> Footer </template> --> <span slot="tags" slot-scope="tags"> <a v-for="tag in tags" :key="tag"//这里后面接到数据后换成了对象,所有tag变成了obj 改成数字即可,或者去掉key :color="tag === 'loser' ? 'volcano' : tag.length > 5 ? 'geekblue' : 'green'" > <p> <a :href="tag.file_url">{{tag.filename}}</a> </p> <!-- <a-spin v-if="tag.length<15" /> --> <!-- <img style="width: 80px;height: 80px;" v-if="tags" :src="tags" alt=""> --> <!-- {{ tag.toUpperCase() }} --> </a> </span> <!-- 内部表 --> <!-- <div slot="expandedRowRender" slot-scope="record" style="margin: 0"> 1231 {{record}} </div> --> </a-table>
this.data.map((v,i)=>{ console.log(v.tags) url =this.baseurl+ 'jk_PLM/get_drow_and_doc.php?pid='+v.key // console.log(url) this.$http.get(url).then((res)=>{ console.log(res.data) this.data[i].tags = res.data // res.data.map((value,ind)=>{ // // value.filename,value.file_url // v.tags.push({
//或者这里添加key // filename:value.filename, // file_url:value.file_url // }) // }) }) console.log(this.data,'================================') })