element列表只允许展开一项

1.这里使用element中的列子

label="商品 ID"

prop="id">

label="商品名称"

prop="name">

label="描述"

prop="desc">

 

2.定义data中的元素

data(){

return{

tableData: [{

id: '12987122',

name: '好滋好味鸡蛋仔',

category: '江浙小吃、小吃零食',

desc: '荷兰优质淡奶,奶香浓而不腻',

address: '上海市普陀区真北路',

shop: '王小虎夫妻店',

shopId: '10333'

}, {

id: '12987123',

name: '好滋好味鸡蛋仔',

category: '江浙小吃、小吃零食',

desc: '荷兰优质淡奶,奶香浓而不腻',

address: '上海市普陀区真北路',

shop: '王小虎夫妻店',

shopId: '10333'

}, {

id: '12987125',

name: '好滋好味鸡蛋仔',

category: '江浙小吃、小吃零食',

desc: '荷兰优质淡奶,奶香浓而不腻',

address: '上海市普陀区真北路',

shop: '王小虎夫妻店',

shopId: '10333'

}, {

id: '12987126',

name: '好滋好味鸡蛋仔',

category: '江浙小吃、小吃零食',

desc: '荷兰优质淡奶,奶香浓而不腻',

address: '上海市普陀区真北路',

shop: '王小虎夫妻店',

shopId: '10333'

}],

expands:[],

},

3.methods中de 方法

//设置展开的内容

expandSelect(row, expandedRows){

var that = this

if (expandedRows.length) {

that.expands = []

if (row) {

that.expands.push(row.id)

}

}

else {

that.expands = []

}

},

getRowKeys(row){

return row.id

}

 

4.在,需要将其设置为props,否则会报错,有知道的同学,可以留言告诉我一下,这是为什么

你可能感兴趣的:(个人学习笔记,vuejs,element,table,列表展开)