VUE element-ui 写个复用Table组件的示例代码

2020-06-16 05:51:16易采站长站整理

//table.vue
<el-table :data="tableData" border @expand="handleExpand" ref="raw_table">
<el-table-column v-if="isExpand" type="expand">
<template scope="scope">
<slot name="expand" :$index="scope.$index" :row="scope.row"></slot>
</template>
</el-table-column>
</el-table>
...
props: ['tableData','tableKey','isExpand','isExpandOnly'],
methods: {
handleExpand(row,is_expand){
if(this.isExpand && this.isExpandOnly){
this.$refs.raw_table.store.states.expandRows = expanded ? [row] : [] }
}
}

其他的(排序、多选)操作也是类似添加。。。多不赘述。