Ant table报错 Warning: [antdv: Each record in table should have a unique `key` prop,or set `rowKey

方法1
<a-table
  :columns="columns"
  :data-source="data"
  size="small"
  :rowKey="(row) => row.key"
> // key为 data 中的一个属性
</a-table>



方法2
<a-table
  :columns="columns"
  :data-source="data"
  size="small"
  :rowKey="
    (row, index) => {
      return index;
    }
  "
> //row 为每一条数据, index 索引
</a-table>



方法3
<a-table
  :columns="columns"
  :data-source="data"
  size="small"
  rowKey="key"
>  // key为 data 中的一个属性 !!! 这里的rowKey不需要冒号
</a-table>



方法4(如果后台返回数据没有给你传key/id,那么我们自己去定义)
<a-table
  :columns="columns"
  :data-source="data"
  size="small"
  rowKey="key"
>  // key为 data 中的一个属性 !!! 这里的rowKey不需要冒号
</a-table>

// 当后台返回数据时 (模拟请求API)
getData(){
    // queryModelTableData  是请求的Api方法 不要太在意  代码重点是下面.then里面的东西
    queryModelTableData({curren:1, size:10}).then(res=>{
        this.data = res.list(如果后台返回数据没有给你传key/id,还要我们自己去加的话,这个方法很实用)
        for (let i in this.data) {
          this.data[i].key = parseInt(i) + 1; //主要就是parseInt 这个方法
       }
    })
}

 

上一篇:C++智能指针的原理和实现


下一篇:LeetCode 动态规划