element-ui组件,全选树节点,新增数据子节点数据,出现回填问题
案情分析:全选后父节点被选中保存,在这个树节点下新增数据时,就会出现,也被选中,事实上数据是没有被选中,也就意味着权限未被配置,而显示是已经配置了,显然这个是一个bug
1.处理前,直接用下面的方法很直接很粗暴的获取id,
var menuId=this.$refs.tree.getCheckedKeys();
2.在用车管理下新增一个子菜单,我的申请用车,结果懵逼了,回填数据也被勾选了,经查找一番,发现是提交的时候全选的缘故,父级菜单id也被带入进来了,坑爹了吧,思路就是剔除权限时候的父级菜单的id,不然每次新增一个菜单都会不被接受的选中了

3.换一下写法,保存的时候剔除父级菜单id,现在显示正常了
let menuId = [];
let nodeData = this.$refs.tree.getCheckedNodes();
nodeData.forEach(el => {
if (el.children === null){
menuId.push(el.id);
}
});

element-ui组件,全选树节点,新增数据子节点数据,出现回填问题的更多相关文章
- element ui组件的开始时间-结束时间验证
<el-date-picker v-model="seach.before" type="date" placeholder="开始时间&quo ...
- (Element UI 组件 Table)去除单元格底部的横线
Element UI 组件 Table 有一个属性 border,添加它可以增加纵向边框,但是无法控制横线边框,因此即使是最简单的 el-table,也会包含一个底部横线. 这个底部横线其实是一个 b ...
- element ui 表格提交时获取所有选中的checkbox的数据
<el-table ref="multipleTable" :data="appList" @selection-change="changeF ...
- easyui tree扩展tree方法获取目标节点的一级子节点
Easyui tree扩展tree方法获取目标节点的一级子节点 /* 只返回目标节点的第一级子节点,具体的用法和getChildren方法是一样的 */ $.extend($.fn.tree.meth ...
- zTree中父节点禁用,子节点可以用
参考学习网址:http://www.treejs.cn/v3/main.php#_zTreeInfo zTree中父节点禁用,子节点可以用 axios.get('/base/unit/unittree ...
- JS编程练习:将目标节点内部的子节点逆序
将目标节点内部的子节点逆序 1 <body> 2 <div> 3 <p></p> 4 <span></span> 5 <e ...
- 删除TreeView节点以及其子节点
//1.删除TreeView节点以及其子节点procedure TForm2.Button1Click(Sender: TObject);var TreeNode:TTreeNode;begin i ...
- [转]Javascript removeChild()删除节点及删除子节点的方法(同样适用于jq)
Javascript removeChild()删除节点及删除子节点的方法 这篇文章主要介绍了Javascript removeChild()删除节点及删除子节点的方法的相关资料,需要的朋友可以参考下 ...
- vue-cli按需引入Element UI组件
一.环境 使用vue-cli搭建的环境 二.安装 babel-plugin-component npm install babel-plugin-component -D 三.修改.babelrc文件 ...
随机推荐
- 在Vue中用富文本编辑器(可以ctrl+c粘贴)
我司需要做一个需求,就是使用富文本编辑器时,不要以上传附件的形式上传图片,而是以复制粘贴的形式上传图片. 在网上找了一下,有一个插件支持这个功能. WordPaster 安装方式如下: 直接使用Wor ...
- Python命令行参数解析模块getopt使用实例
Python命令行参数解析模块getopt使用实例 这篇文章主要介绍了Python命令行参数解析模块getopt使用实例,本文讲解了使用语法格式.短选项参数实例.长选项参数实例等内容,需要的朋友可以参 ...
- Jsoup-基础练习
认识Jsoup 一个解析网页的工具 无论你用什么语言爬虫,都要解析网页,今天,我们用一款常用的网页解析Jsoup,来开启爬虫的第一课 认识网页,认识爬虫,认识你自己 *** 快速上手 了解一个新东西最 ...
- Java遍历日期代码
import java.util.ArrayList; import java.util.List; public class DateTraveller { public static List&l ...
- Jrebel激活方法
参考 https://www.yanjiayu.cn/posts/3eecb801.html https://gitee.com/gsls200808/JrebelLicenseServerforJa ...
- 同时支持Android 和 ios 投屏到电脑的软件,Support Android and ios screen shrare to PC - 希沃授课助手
最近学校由粉笔黑板更换了智慧电子黑板,然后发现了一个好玩的软件. 感谢希沃公司的开发: 希沃授课助手,这是一款同时支持Android 和 ios 投屏和远程控制的. 效果很流畅,非常赞
- C/C++查漏补缺(常更)
一.#define宏定义 如下程序段,则输出结果为: #define MAX 12 int main(){ cout << "20\0MAX019" << ...
- Linux与windows的对比
Linux与windows的对比 声明:下面的内容总结自实验楼的linux教程,特在此说明. Linux与windows一样,是一个操作系统. Linux与Windows的区别 软件与支持 windo ...
- redis 设置后台守护运行的两种方式
第一种:进入src目录,执行 nohup ./redis-server & 第二种:redis.conf==> daemonize=yes,启动redis-server后面加redis. ...
- 华为eNSP上的NAT地址转换配置
NAT是将IP数据报文报头中的IP地址转换为另一个IP地址的过程,主要用于实现内部网络(私有IP地址)访问外部网络(公有IP地址)的功能. 1.实验拓扑 地址表: 1.完成各个接口基本配置之后使用pi ...