饿了么el-tree组件移动节点方法

黄权彬DX

已于 2023-09-11 15:05:44 修改

阅读量222

点赞数

文章标签：前端

于 2023-09-11 15:04:55 首次发布

本文链接：https://blog.csdn.net/weixin_54108198/article/details/132808223

版权

handleDrop(draggingNode, dropNode, dropType, ev) {
      let params = {}
      switch (dropType) {
        // 移动到dropNode前面
        case 'before':
          params = {
            id: draggingNode.data.id,
            prevId: dropNode.data.prevId, // dropNode的前节点即是当前目标位置的前节点
            parentId: dropNode.data.parentId,
          }
          break
        // 移动到dropNode后面
        case 'after':
          params = {
            id: draggingNode.data.id,
            prevId: dropNode.data.id, // dropNode本身即是当前目标位置的前节点
            parentId: dropNode.data.parentId,
          }
          break
        // 移动到dropNode内
        case 'inner':
          let prevId = ''
          for (let i = dropNode.data.child.length - 1; i >= 0; i--) {
            if (dropNode.data.child[i].id != draggingNode.data.id) {
              // dropNode原先最后一个子节点即是当前目标位置的前节点
              prevId = dropNode.data.child[i].id
              break
            }
          }
          params = {
            id: draggingNode.data.id,
            prevId: prevId,
            parentId: dropNode.data.id,
          }
          break
      }
      moveScriptGroup(params)
        .then((res) => {
          if (res.flag) {
            openPromptBox('success', '目录节点移动成功')
          } else {
            let errorText = '目录节点移动失败！'
            if (res.message) {
              errorText = res.message
            }
            openPromptBox('error', errorText)
              .then(() => {})
              .catch(() => {})
          }
          this.getMenuTree()
        })
        .catch(() => {})
    },