elementui expand-row-keys自动展开

1,834 阅读1分钟

效果图

image.png

基本需求

组织单位名称

1.以组织单位为主键,作成树形列表

2.以组织单位名称为主体表示

3.实现懒加载

4.初始只展示当前所属单位和下一级单位,如果是最后一层、则只展示当前层

5.居左展示

代码

  <div class="elTableBox">
            <el-table
              :header-cell-style="{ 'text-align': 'center' }"
              :cell-style="{ 'text-align': 'center' }"
              v-loading="loading"
              :expand-row-keys="expands"//这里
              :data="menuList"
              row-key="deptId"
              :row-style="{ height: '60px' }"
              :tree-props="{
                children: 'children',
                hasChildren: 'hasChildren',
              }"
            >
            ...
   data() {
    return {
      expands:[],//必须为数组
    };
  },
  

js部分

resonse.data为接口返回的数据 deptId是判定为哪一层的数据

this.expands.push(response.data[0].deptId + "");