目前可实现所有节点自动加载,但是数据加载完,三角并没有从loading变回三角,可能是因为我们系统自己封装组件的原因,现在需求取消了,先记录一下现状
界面:
VUE:主要是设置default-expand-all属性为true,指定expand-row-keys数组
<el-table
ref="treeTable"
:key="componentsKey"
v-loading="dataListLoading"
:data="dataList"
lazy
row-key="deptId"
:check-box="isDeptAdminShow()"
parent-child
:load="load"
:columns="columns"
class="dept-tree-table"
:expand-row-keys="expandRowKeys"
:default-expand-all="true"
@treeTableSelect="getTreeTableSelect"
>
</el-table>
JS:
data中声明
expandRowKeys: []
async load(tree, treeNode, resolve) {
let params = { deptId: tree.deptId, deptName: this.deptName }
const { data } = await getChildNodes(params) // 获取子节点
if (data) {
for (let item of data) {
this.expandRowKeys.push(item.deptId) //将需要展开的节点主键添加进去
}
return resolve(data)
}
},
//updated声明周期中调用点击方法
updated(){
this.arrowAll()
},
//method中
//获取到页面元素 模拟点击可实现让树形表格展开
arrowAll () {
let expand = document.getElementsByClassName('el-icon-arrow-right')
if (expand.length > 0) {
for (let i = 0; i < expand.length; i++) {
expand[i].click()
}
}
}