如何在element UI的tree组件中获取选中的数据及半选中节点数据 并将选中的数据组合成data格式的数据

在Element UI的Tree组件中，我们可以通过监听`node-click`和`check-change`事件来获取选中的数据及半选中节点数据，并将其组合成data格式的数据。具体步骤如下：

1. 在`<el-tree>`标签中添加`@node-click`和`@check-change`事件监听：

<el-tree :data="data" :props="defaultProps" node-key="id" @node-click="handleNodeClick" @check-change="handleCheckChange"></el-tree>

2. 在Vue实例中添加`handleNodeClick`和`handleCheckChange`方法：

methods: {
  // 处理节点点击事件
  handleNodeClick(data, node, self) {
    // 获取选中的节点数据
    console.log(data)
  },
  // 处理复选框状态改变事件
  handleCheckChange(data, checked, indeterminate) {
    // 获取选中的节点数据及半选中节点数据
    console.log(data, checked, indeterminate)
  }
}

3. 将选中的数据组合成data格式的数据：

data() {
  return {
    selectedData: []
  }
},
methods: {
  // 处理节点点击事件
  handleNodeClick(data, node, self) {
    // 获取选中的节点数据
    this.selectedData.push({
      id: data.id,
      label: data.label,
      children: []
    })
  },
  // 处理复选框状态改变事件
  handleCheckChange(data, checked, indeterminate) {
    // 获取选中的节点数据及半选中节点数据
    let selected = []
    for (let i = 0; i < data.length; i++) {
      if (data[i].checked) {
        selected.push({
          id: data[i].id,
          label: data[i].label,
          children: []
        })
      }
      if (data[i].indeterminate) {
        let node = {
          id: data[i].id,
          label: data[i].label,
          children: []
        }
        // 遍历半选中节点的子节点
        for (let j = 0; j < data[i].children.length; j++) {
          if (data[i].children[j].checked) {
            node.children.push({
              id: data[i].children[j].id,
              label: data[i].children[j].label,
              children: []
            })
          }
        }
        selected.push(node)
      }
    }
    this.selectedData = selected
  }
}

在`handleNodeClick`方法中，我们将选中的节点数据以对象的形式添加到`selectedData`数组中。在`handleCheckChange`方法中，我们遍历所有选中的节点和半选中的节点，并将其转换成data格式的数据。

最后，我们就可以在Vue实例中访问`selectedData`数组，获取选中的数据及半选中节点数据了。