没有 dropPosition oldParent oldNode node 等属性
时间: 2024-04-21 21:23:26 浏览: 34
抱歉,我之前给出的代码可能与你使用的UI 版本不匹配。在较新的版本中,`@node-drag-end` 事件的参数可能有所变化。
在较新的版本中,可以通过 `@node-drag-end` 事件的回调函数参数来获取拖拽结束时的相关信息。下面是一个示例代码,展示如何交换两个节点的位置:
```html
<template>
<el-tree :data="treeData" :props="treeProps" @node-drag-end="handleNodeDragEnd"></el-tree>
</template>
<script>
export default {
data() {
return {
treeData: [
// 树的数据结构
],
treeProps: {
// 树的属性配置
}
}
},
methods: {
handleNodeDragEnd(event) {
const { dropNode, dropPosition, oldNode, oldParent, newParent } = event;
// 获取拖拽节点的位置
const oldIndex = oldParent.data.children.indexOf(oldNode.data);
const newIndex = newParent.data.children.indexOf(dropNode.data);
// 交换节点位置
oldParent.data.children.splice(oldIndex, 1);
newParent.data.children.splice(newIndex, 0, oldNode.data);
}
}
}
</script>
```
在这个示例中,我们通过解构赋值获取了 `dropNode`(拖放的节点)、`dropPosition`(拖放位置)、`oldNode`(原始节点)等参数。然后,我们使用这些参数来计算节点的索引,并使用 `splice` 方法交换节点的位置。
请注意,具体的参数可能会因 elementUI 的版本而有所改变。请参考你正在使用的 elementUI 的文档和示例来确定正确的参数和用法。
阅读全文