html表格收起展开,vue-table-element表格的全部展开和全部折叠

以下是二级表格的展开折叠，三级同样：

展开折叠

1.给按钮添加展开和折叠事件：

全部展开

全部折叠

2.在export-methods 下添加方法：

data(){

return {

isExpand:true,// 默认为展开状态

}

}

methods: {

actionUnfoldFunc(isAss){

//this.$refs.ctab.handleExpand(isAss)

this.handleExpand(isAss)

},

handleExpand(isAss) {

// 此判断是否为展开转台或折叠状态--若展开折叠是同一个按钮则无需传参和加此if

if (this.isExpand == isAss){

return

}

this.isExpand = !this.isExpand

// this.tableData为返回的二级数据data

this.$nextTick(() => {

this.forArr(this.tableData, this.isExpand)

})

},

// 遍历

forArr(arr, isExpand) {

arr.forEach(i => {

// toggleRowExpansion见element文档

this.$refs.ctab.toggleRowExpansion(i, isExpand)

if (i.children) {

this.forArr(i.children, isExpand)

}

})

},

}

3.点击即可实现全部展开和折叠；

完！