uniapp使用树控件对节点进行增删改查操作

UniApp（原DCloud）是一款基于Vue.js的跨平台开发框架，它允许开发者构建一次，多端运行，包括Web、H5、小程序等。对于树形控件，UniApp提供了一个叫做`u-tree-select`或`u-tree`的组件，用于展示和管理数据的层级结构。

在UniApp中进行树节点的增删改查操作通常涉及以下几个步骤：

1. **初始化**: 首先，在模板文件中引入并使用树控件，设置初始的数据源和必要的配置属性，比如允许删除、添加等权限。

<u-tree :data="treeData" @node-add="handleNodeAdd" @node-delete="handleNodeDelete"></u-tree>

2. **事件处理**:
- `@node-add`: 当用户点击添加按钮或者通过API添加新节点时，`handleNodeAdd`函数会被触发，可以在这里创建新的节点并将其添加到数据源中。
- `@node-delete`: 删除节点时，通过`handleNodeDelete(node)`来移除指定的节点，这里传递的是要删除的节点对象。

methods: {
    handleNodeAdd() {
        let newNode = { key: '', label: '新建节点', parentKey: this.currentSelectedNode.key };
        // ... 在此处添加新节点到数据数组
    },
    handleNodeDelete(node) {
        let index = this.treeData.findIndex(item => item.key === node.key);
        if (index !== -1) {
            this.treeData.splice(index, 1);
        }
    },
}

3. **状态管理**: 数据变动时，确保同步更新视图层，如果使用Vuex进行状态管理，记得更新store。

4. **数据维护**: 节点的增删会改变整个树的结构，因此在修改后需要调整节点之间的引用关系，确保数据的一致性。