el-tree和el-table一键展开和一键收起

    <el-table
          v-loading="loading"
          :data="productList"
          lazy
          border
          ref="dataTreeList"
          :span-method="objectSpanMethod"
          :row-key="getRowkey"
          :load="load"
          :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
          @selection-change="handleSelectionChange"
          :cell-class-name="addClass2"
        >
   methods: {
        getRowkey(row) {
          if (row.idDi) {
            return row.idDi;
          }
          return row.id;
        },
        // 切换数据表格树形展开
        toggleRowExpansion() {
          this.isExpansion = !this.isExpansion;
          this.toggleRowExpansionAll(this.productList, this.isExpansion);
        },
        toggleRowExpansionAll(data, isExpansion) {
          data.forEach(item => {
            this.$refs.dataTreeList.toggleRowExpansion(item, isExpansion);
            if (item.children !== undefined && item.children !== null) {
              this.toggleRowExpansionAll(item.children, isExpansion);
            }
          });
        },
}

默认不要展开的 再data中定义isExpansion：false



           <div
            v-if="hasTree"
            class="tree"
            :class="[sideTheme, { open: treeCollaspe }]"
            ref="tree"
            @mouseover="showTree"
            @mouseout="hideTree"
          >
            <!--   @mouseout="hideTree" -->
            <div class="arrow">
              <i class="el-icon-arrow-right tree-arrow"></i>
            </div>
            <div class="tree-content">
              <el-input
                placeholder="输入关键字进行过滤"
                v-model="filterText"
                suffix-icon="el-icon-search"
                clearable
              ></el-input>
              <el-button
                type="primary"
                plain
                :icon="expandAll ? 'el-icon-arrow-up' : 'el-icon-arrow-down'"
                size="mini"
                @click="expandHandle(expandAll)"
                >{{ expandAll ? "全部收起" : "全部展开" }}</el-button
              >
              <div class="tabs" :class="sideTheme">
                <el-radio-group v-model="treeType">
                  <el-radio-button label="行政区域"></el-radio-button>
                  <el-radio-button label="单位树"></el-radio-button>
                </el-radio-group>
              </div>
              <br />
              <!-- 是否暂时菜单列表  default-expand-all -->
              <el-scrollbar style="height: calc(100% - 110px)">
                <el-tree
                  class="filter-tree"
                  :data="data"
                  :props="defaultProps"
                  :expand-on-click-node="false"
                  :default-expand-all="expandAll"
                  :filter-node-method="filterNode"
                  ref="treeList"
                  @current-change="getCheckedNodes"
                  icon-class="el-icon-arrow-right"
                >
                  <span
                    class="el-tree-node__label"
                    :title="node.label"
                    slot-scope="{ node }"
                    >{{ node.label }}</span
                  >
                </el-tree>
              </el-scrollbar>

// 默认这个展开tree是不展开的 expandAll: false,

         // 点击tree展示还是收起
expandHandle() {
  console.log(this.$refs.treeList.store);
  this.expandAll = !this.expandAll;
  this.expandNodes(this.$refs.treeList.store.root);
},
// 遍历树形数据，设置每一项的expanded属性，实现展开收起
expandNodes(node) {
  node.expanded = this.expandAll;
  for (let i = 0; i < node.childNodes.length; i++) {
    node.childNodes[i].expanded = this.expandAll;
    if (node.childNodes[i].childNodes.length > 0) {
      this.expandNodes(node.childNodes[i]);
    }
  }
},