要求是一个表格展示树形数据,默认展开一级
在table中要设置 row-key expand-row-keys绑定一个key的数组
注意事项:
获取树之后遍历 将ID push到数组中 此处Array里面存放key的字符串 而不是number
<el-table
:data="dataList"
border
v-loading="dataListLoading"
@selection-change="selectionChangeHandle"
style="width: 100%;"
@row-click="clickRow"
ref="clickRowTable"
:header-cell-style="{background:'#dee1e5', color:'#606266'}"
row-key="id"
:tree-props="{children: 'children'}"
:expand-row-keys="expandKeys"
@sort-change= "shortChange">
<el-table-column show-overflow-tooltip
type="selection"
header-align="center"
align="center"
width="50">
</el-table-column>
<el-table-column show-overflow-tooltip align="center" type="index" label="序号" width="60"></el-table-column>
<el-table-column show-overflow-tooltip
prop="id"
header-align="center"
align="center"
label="主键">
</el-table-column>
<el-table-column show-overflow-tooltip
prop="organNo"
header-align="center"
align="center"
label="机构号"
>
</el-table-column>
</el-table>
this.expandKeys = []
this.dataList.forEach(item => {
this.expandKeys.push(item.id + "")
})
还有一个问题需要注意:
我之前的element-ui版本为2.0.4 而表格树默认展开功能是要版本2.9.0以上才支持的
所以即使写了
row-key="id"
:tree-props="{children: 'children'}"
:expand-row-keys="expandKeys"
这几个属性 虽然有表格树的效果 但是默认展开这件事是没反应的 研究了好久才发现是版本问题 感到气气