英文:
Vue.js Bootstrap table - How to extract IDs of table rows and collect them in a data property
问题
我正在使用Vue.js的Bootstrap表格，我想要能够收集每个表格行的ID并存储在一个数组或对象的数据属性中。
以下是一个Bootstrap表格模板的示例：
<template v-slot:cell(label)="row">
<div>
<div class="label"></div>
</div>
</template>
那么，我该如何将row.item.id的值收集到一个数组或对象中，以便在其他地方使用这些数据？
英文:
I'm using Vue.js Bootstrap table and I would like to be able to collect each table row id in an Array or Object data property.
Here is an example of a bootstrap table template:
<template v-slot:cell(label)="row" >
<div >
<div class="label"></div>
</div>
</template>
So, how can I collect row.item.id values in an Array or in an Object in order to use this data for other purposes?
答案1
得分: 1
你可以使用 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)
}
英文:
You can simply store any property from the items array into a separate array by iterating using Array.map() method.
For example :
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: []
}
}
Then in mounted hook :
mounted() {
this.itemsID = this.items.map(({id}) => id)
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论