zoukankan      html  css  js  c++  java
  • elment 中tree组件展开所有和收缩所有节点

     //收起所有节点
                setCheckedKeys() {
                    this.defaultExpand = false;
                    for (var i = 0; i < this.$refs.tree.store._getAllNodes().length; i++) {
                         if (this.$refs.tree.store._getAllNodes()[i].id !== 1) {
                             this.$refs.tree.store._getAllNodes()[i].expanded = this.defaultExpand;
                        }
                    }
                },
    
                setCheckedNodes() {
                    this.defaultExpand = true; //展开所有节点
                    for (var i = 0; i < this.$refs.tree.store._getAllNodes().length; i++) {
                        this.$refs.tree.store._getAllNodes()[i].expanded = this.defaultExpand;
                       
                    }
                }
    <el-tree :data="deptData" :props="defaultProps" v-loading="listLoading" :default-expanded-keys="idArr" @@node-click="handleNodeClick" node-key="Id"
                             :expand-on-click-node="true"
                             :filter-node-method="filterNode"
                             :render-content="renderContent" ref="tree">
                    </el-tree>

    参见网上写法:

     <div>
                <iclass="arrow-down el-icon-arrow-down" @click="allExpand(true)" title="展开所有"></i>
                <iclass="arrow-down el-icon-arrow-up" @click="allExpand(false)" titie="收缩所有"></i>
    
     </div>
    
     <el-tree
                        :data="AiditReportData"
                        node-key="id"
                        ref="selectTree"
                        :default-expand-all="true"
                        :default-expanded-keys="defaultExpandArr"
                    >
    
    
    
     upAll () {
        // 全部展开  遍历变成true
        let self = this;
        // 将没有转换成树的原数据
        let treeList = this.sourceData;
        for (let i = 0; i < treeList.length; i++) {
        // 将没有转换成树的原数据设置key为... 的展开
        self.$refs.selectTree.store.nodesMap[treeList[i].id].expanded = true
        }
    },
    
    
      public allExpand(isExpand: boolean) {
          const that: any = this;
          const treeList = this.AiditReportData;
          console.log('isExpand', isExpand);
          for (let i = 0; i < treeList.length; i++) {
            that.$refs.selectTree.store.nodesMap[treeList[i].id].expanded = isExpand;
          }
    
      }
    
    
    //原文:https://www.cnblogs.com/ll15888/p/12002745.html

    this.$refs.tree.store


    this.$refs.tree.store.currentNode = null

    Object.keys(this.$refs.tree.store.nodesMap).map((key, index) => {
    this.$refs.tree.store.nodesMap[key].checked = false
    this.$refs.tree.store.nodesMap[key].expanded = false
    })

  • 相关阅读:
    读书是最划算的自我投资,免费送几本最好的Python学习电子书
    一个出身寒门的状元之编程
    幼儿园小朋友都在学人工智能了,已经从小学毕业的我们该如何学?
    python语音识别终极指南
    Python可视化神器——pyecharts的超详细使用指南!
    用 Python 分析过往 36 年春晚节目数据,发现一些趣事
    拉勾网数据分析职位分析
    按时分秒对数据进行分箱
    numpy
    基于协同过滤的推荐系统案列
  • 原文地址:https://www.cnblogs.com/shy1766IT/p/13383809.html
Copyright © 2011-2022 走看看