element-ui 怎样动态控制树的全部折叠和展开

在element-ui的el-tree组件中，可以使用`:default-expand-all`属性来控制树的默认展开状态，如果设置为`true`，则树中的所有节点都会被展开，如果设置为`false`，则树中的所有节点都会被折叠。

如果你需要动态控制树的展开和折叠，可以通过修改`:default-expand-all`属性的值来实现。例如，你可以在按钮的点击事件中，修改`:default-expand-all`属性的值，然后手动刷新el-tree组件即可。

示例代码如下：

<template>
  <div>
    <el-button @click="handleExpandAll(true)">全部展开</el-button>
    <el-button @click="handleExpandAll(false)">全部折叠</el-button>
    <el-tree :data="data" :default-expand-all="defaultExpandAll" ref="tree"></el-tree>
  </div>
</template>

<script>
export default {
  data() {
    return {
      data: [
        {
          label: '一级 1',
          children: [
            {
              label: '二级 1-1',
              children: [
                {
                  label: '三级 1-1-1'
                }
              ]
            }
          ]
        }
      ],
      defaultExpandAll: false
    }
  },
  methods: {
    handleExpandAll(isExpand) {
      this.defaultExpandAll = isExpand
      this.$refs.tree.$forceUpdate()
    }
  }
}
</script>

在上面的代码中，我们通过给按钮绑定点击事件来控制树的展开和折叠。在点击按钮时，我们修改了`defaultExpandAll`属性的值，并调用了el-tree组件的`$forceUpdate`方法来强制刷新树的状态。这样，就可以实现动态控制树的展开和折叠了。