ElementUI的tree组件子选父不选提交数据问题

问题描述

最近也写了一段时间的VUE了,用的就是Element-UI组件,今天使用tree组件的时候,发现el-tree控件中子节点未全部选中,提交树形数据时,后台API接收数据时没有发现父节点,完了在前端console打印了一下log,发现el-tree组件没有提交处于半选择状态的节点ID,记录一下解决方案。

VUE Element-UI

原因

Element-UI组件中el-tree控件中子节点未全部选中时,父节点ID在提交时不会传给后台接口,导致后台获取不到父节点ID,所以后台API数据中没有半选择的父节点ID数据。

解决方案

直接上代码:

1
2
3
4
5
6
7
const checked = this.$refs.menuTree.getCheckedKeys() // 全选状态ID
const halfChecked = this.$refs.menuTree.getHalfCheckedKeys() // 半选状态ID

// 合并数据方式一
const keys = [...checked, ...halfChecked]
// 合并数据方式二
const keys = checked.concat(halfChecked)

提交的部分就自己写了,主要就是封装axios成功方法,Promise去获取数据。


ElementUI的tree组件子选父不选提交数据问题
http://pygo2.top/articles/35413/
作者
mingliang.gao
发布于
2022年5月15日
许可协议