element plus 可选择树形组件(el-tree) 怎样一键展开/收起?实现方法详解

实现代码:

按钮:

<el-button @click="takeall" style="height: 24px">
    {
  {zhanstatus % 2 != 0 ? "收起所有" : "展开所有"}}
</el-button>

组件:

        <el-form-item label="可选择菜单" :label-width="formLabelWidth">
          <el-tree
            ref="folderTreeRef"
            :data="mneudata"
            show-checkbox
            node-key="id"
            highlight-current
            :props="defaultProps"
          />
        </el-form-item>

 在ref中绑定folderTreeRef 

展开&收起:

const folderTreeRef = ref(null);
const zhanstatus = ref(0);
let takeall = () => {
  zhanstatus.value++;
  if (zhanstatus.value % 2 == 0) {
    const nodes = folderTreeRef.value.store._getAllNodes();
    nodes.forEach(item => {
      item.expanded = false;
    });
  } else {
    const nodes = folderTreeRef.value.store._getAllNodes();
    nodes.forEach(item => {
      item.expanded = true;
    });
  }
};

效果:

实现原理:

打印上面的 folderTreeRef ,可以从原型链的store中找到 _getAllNodes 属性

官方文档好像没有描述关于此属性的内容,查了好多资料,搜了多篇文章,可以发现store原型中有_getAllNodes 这个属性

稍微试了一下居然成功了 (๑ᵒ̴̶̷͈᷄ᗨᵒ̴̶̷͈᷅)

最近更新

  1. TCP协议是安全的吗?

    2024-01-19 15:58:01       19 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-01-19 15:58:01       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-01-19 15:58:01       20 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-01-19 15:58:01       20 阅读

热门阅读

  1. mysql 自动生成随机数

    2024-01-19 15:58:01       36 阅读
  2. Mysql 报错Parameter ‘@xxx‘ must be defined

    2024-01-19 15:58:01       33 阅读
  3. Echarts 图表自适应

    2024-01-19 15:58:01       34 阅读
  4. User表设计

    2024-01-19 15:58:01       32 阅读
  5. 算法-排序

    2024-01-19 15:58:01       26 阅读
  6. Mysql旧数据处理常用sql模板·持续更新...

    2024-01-19 15:58:01       33 阅读
  7. 中文论文写作过程中的-GPT命令----未完待续

    2024-01-19 15:58:01       34 阅读
  8. 生成指定位数的编号,不够的在左边补0

    2024-01-19 15:58:01       32 阅读
  9. 如何学习一些需要算法的程序

    2024-01-19 15:58:01       36 阅读
  10. Js面试之防抖与节流

    2024-01-19 15:58:01       31 阅读
  11. 前端实现汉堡菜单

    2024-01-19 15:58:01       36 阅读
  12. 编写递归算法,计算二叉树T中叶子结点的数目。

    2024-01-19 15:58:01       27 阅读