Tree全部展開/折疊


<template>

  <el-tree :data="navs" :props="defaultProps" show-checkbox ref="tree" highlight-current draggable  node-key="navId"   :default-expand-all="defaultExpand"> </el-tree>

  <el-button @click="setCheckedNodes">展開所有菜單</el-button>

  <el-button @click="setCheckedKeys">收起所有菜單</el-button>

</template>

<script>

export default { 
  data() {
    return {

      navs:[],   //所有菜單 

        defaultProps: {
        id:'navId',
        children: 'snavList',
        label: 'navName',
        disabled:'navOffOn'
        },

 

      defaultExpand:true,  //默認展開所有節點

    }

  },

  methods: {

    setCheckedKeys() {  
      this.defaultExpand=false;
      for(var i=0;i<this.$refs.tree.store._getAllNodes().length;i++){
        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;
      }
    }

  }

}

</script>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM