el-tree 一键展开/收起

Html

 <el-dialog
        title="区域库存设置"
        :visible.sync="zoneVisible"
        width="50%"
    >
      <div style="margin-bottom:20px;">
        <el-input v-model="configData" clearable size="small" style="width: 200px;margin-right:20px;"
                  placeholder="请输入配置信息"></el-input>
        <el-button type="primary" @click="setConfig" size="small">一键配置</el-button>
        <el-button type="primary" @click="clearConfig" size="small">清空配置</el-button>
        <el-button type="primary" @click="toggleRowExpansion" size="small">全部{{ isExpansion ? '收缩' : '展开' }}</el-button>
      </div>
      <div style="height:60vh;overflow-y:auto;">
        <el-table
            ref="topicTable"
            :data="zoneData"
            style="width: 100%;margin-bottom: 20px;"
            row-key="id"
            border
            default-expand-all
            :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
          <el-table-column
              prop="areaName"
              label="省市"
          >
          </el-table-column>
          <el-table-column
              label="库存"
          >
            <template slot-scope="scope">
              <input type="number" v-model="scope.row.stock"
                     style="height:35px;padding:0 5px;border:1px solid #eee;border-radius:5px;">
              <!-- <el-input type="number" ></el-input> -->
            </template>
          </el-table-column>
        </el-table>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="zoneVisible = false">取 消</el-button>
        <el-button type="primary" @click="handleUpdateSaleArea">确 定</el-button>
      </span>
    </el-dialog>

  setData() {
      let tempData = this.zoneData;
      console.log('this.zoneData', this.zoneData)
      tempData.forEach(item => {
        item.stock = this.configData ? this.configData : null;
        if (item.children) {
          item.children.forEach(item => {
            item.stock = this.configData ? this.configData : null;
          })
        }
      })
      this.zoneData = tempData;
    },
    clearConfig() {
      this.configData = null;
      this.setData();
    },
    setConfig() {
      if (!this.configData) {
        return this.$message.error('请输入配置信息')
      }
      this.setData()
    },
    toggleRowExpansion() {
      this.isExpansion = !this.isExpansion
      this.toggleRowExpansion_forAll(this.zoneData, this.isExpansion);
    },
    toggleRowExpansion_forAll(data, isExpansion) {
      data.forEach(item => {
        this.$refs.topicTable.toggleRowExpansion(item, isExpansion);
        if (item.children != undefined && item.children != null) {
          this.toggleRowExpansion_forAll(item.children, isExpansion);
        }
      })
    },

树形数据结构

[
{
"children": [
{
"Level": 2,
"areaId": 2,
"areaName": "市辖区",
"id": 2,
"label": "市辖区",
"stock": null,
"areaFullId": "1,2"
}
],
"Level": 1,
"areaId": 1,
"areaName": "北京市",
"id": 1,
"label": "北京市",
"stock": 1200,
"areaFullId": "1"
}]