首页  >  问答  >  正文

提取Vue.js Bootstrap表格行ID并收集到数据属性的方法

我正在使用Vue.js Bootstrap表格,我希望能够将每个表格行的id收集到一个数组或对象数据属性中。

这是一个Bootstrap表格模板的示例:

<template v-slot:cell(label)="row" >
        <div >
          <div class="label"></div>
        </div>
      </template>

那么,我该如何将row.item.id的值收集到一个数组或对象中,以便将这些数据用于其他目的?

P粉553428780P粉553428780422 天前428

全部回复(1)我来回复

  • P粉670107661

    P粉6701076612023-09-16 00:21:02

    您可以通过使用Array.map()方法迭代,将items数组中的任何属性存储到一个单独的数组中。

    例如

    data() {
      return {
        items: [
          { id: 1, age: 40, first_name: 'Dickerson', last_name: 'Macdonald' },
          { id: 2, age: 21, first_name: 'Larsen', last_name: 'Shaw' },
          { id: 3, age: 89, first_name: 'Geneva', last_name: 'Wilson' },
          { id: 4, age: 38, first_name: 'Jami', last_name: 'Carney' }
        ],
        itemsID: []
      }
    }

    然后在mounted钩子中

    mounted() {
        this.itemsID = this.items.map(({id}) => id)
    }

    回复
    0
  • 取消回复