el-tree还原拖拽
时间: 2023-10-06 21:09:34 浏览: 100
el-select-tree:ElementUI的el-select与el-tree结合
5星 · 资源好评率100%
对于el-tree的还原拖拽操作,可以通过以下步骤实现。
首先,为了实现拖拽的还原,我们需要在拖拽完成时触发一个事件,并将相应的数据进行处理。在el-tree组件中,可以通过设置`@node-drop`事件来实现。该事件会在拖拽完成时被触发,并提供了被拖拽节点、结束拖拽时最后进入的节点、被拖拽节点的放置位置等参数。
其次,我们需要将拖拽完成时的数据进行持久化,即将数据保存到数据库中。可以根据业务需求选择合适的方式,比如通过发送请求将数据传给后端进行保存。
最后,当需要还原拖拽时,可以从数据库中获取已保存的数据,并将数据重新设置到el-tree组件的`data`属性中,以实现还原拖拽的效果。
总结起来,还原拖拽操作需要以下步骤:
1. 设置`@node-drop`事件,并在事件回调函数中处理拖拽完成时的数据;
2. 将数据持久化到数据库中;
3. 当需要还原拖拽时,从数据库中获取数据,并将数据设置到el-tree组件的`data`属性中。
这样就能够实现el-tree的还原拖拽操作了。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [【el-tree】树形结构拖拽](https://blog.csdn.net/hejingfang123/article/details/120316756)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]
阅读全文