然后我改了 rowKey 給他加了唯一標(biāo)識(shí) rowKey=“id+‘s’” 后就不再重復(fù)了，但是在查詢的時(shí)候又出來另一個(gè)錯(cuò)，沒條數(shù)據(jù)都要有同樣的Key值，于是我再初始加載的方法里加了下面展示一些內(nèi)聯(lián)代碼片。

  created() {
     data.forEach((item, index) => {
        item.key = index + 1;
      })
    }

但是這樣就會(huì)顯示data找不到 dataSource 在jeecgboot中是封裝了的所以得把方法拿到頁面上來。

我試了許久無果后，就看了看數(shù)據(jù)庫才發(fā)現(xiàn)數(shù)據(jù)庫id 因?yàn)槲也闀r(shí)間的原因很多重復(fù)，于是我做了按時(shí)間一個(gè)分組發(fā)現(xiàn)就不報(bào)錯(cuò)了。

v-for key值重復(fù)報(bào)錯(cuò)

<li
? v-for="(item,i) in infoDatac.notice.admitted"
? :key="'A'+ i"
>
? <div>申請單號(hào)：{{ item.applyCode }}</div>
? <div>使用時(shí)間：{{ item.useTime }}</div>
? <span>{{ item.title }}</span>
</li>
<li
? v-for="(item,i) in infoDatac.notice.waybillTimeout"
? :key="'B'+ i"
>
? <div>運(yùn)單號(hào)：{{ item.waybillCode }}</div>
? <div>申請單號(hào)：{{ item.applyCode }}</div>
? <div>物料名稱：<span class="tooltip short">
? ? <Tooltip :content="item.materialName" placement="top">
{{ item.materialName }}
? ? </Tooltip></span
? ></div>
? <div>所超時(shí)長：{{ item.timeOut }}</div>
? <span>{{ item.title }}</span>
</li>

這里例子中的 A,B 字符可以替換成你自己定義的任意字符，只是為了保證key的唯一性

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

關(guān)于vue 的slot分發(fā)內(nèi)容 (多個(gè)分發(fā))
這篇文章主要介紹了關(guān)于vue 的slot分發(fā)內(nèi)容 (多個(gè)分發(fā))，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-03-03
Vue組件實(shí)現(xiàn)觸底判斷
這篇文章主要為大家詳細(xì)介紹了Vue組件實(shí)現(xiàn)觸底判斷，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2019-06-06
vue3.0中使用element的完整步驟
這篇文章主要給大家介紹了關(guān)于vue3.0中使用element的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2021-03-03
vue項(xiàng)目中使用vue-i18n報(bào)錯(cuò)的解決方法
這篇文章主要給大家介紹了關(guān)于vue項(xiàng)目中使用vue-i18n報(bào)錯(cuò)的解決方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-01-01
vue?實(shí)現(xiàn)左滑圖片驗(yàn)證功能
網(wǎng)頁中滑動(dòng)圖片驗(yàn)證一直是各大網(wǎng)站、移動(dòng)端的主流校驗(yàn)方式，其主要作用是為了區(qū)分人和機(jī)器以及為了防止機(jī)器人程序暴力登錄或攻擊從而設(shè)置的一種安全保護(hù)方式，這篇文章主要介紹了vue?實(shí)現(xiàn)左滑圖片驗(yàn)證,需要的朋友可以參考下
2023-04-04
詳解vue.js之props傳遞參數(shù)
給大家詳細(xì)分析了vue.js之props傳遞參數(shù)的相關(guān)知識(shí)以及問題解決方法，需要的朋友參考下吧。
2017-12-12
Vue3中element-plus全局使用Icon圖標(biāo)的過程詳解
我們在用vue開發(fā)網(wǎng)站的時(shí)候,往往圖標(biāo)是起著很重要的作,這篇文章主要給大家介紹了關(guān)于Vue3中element-plus全局使用Icon圖標(biāo)的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2022-01-01
vue監(jiān)聽頁面中的某個(gè)div的滾動(dòng)事件并判斷滾動(dòng)的位置
本文主要介紹了vue監(jiān)聽頁面中的某個(gè)div的滾動(dòng)事件并判斷滾動(dòng)的位置，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-03-03
vue+iview的菜單與頁簽的聯(lián)動(dòng)方式
這篇文章主要介紹了vue+iview的菜單與頁簽的聯(lián)動(dòng)方式，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2021-07-07
VUE項(xiàng)目初建和常見問題總結(jié)
在本篇文章里小編給大家整理的是關(guān)于VUE 項(xiàng)目初建和常見問題以及相關(guān)知識(shí)點(diǎn)內(nèi)容，有需要的朋友們學(xué)習(xí)下。
2019-09-09