1. <el-tree
  2. class="filter-tree"
  3. :data="permissionData"
  4. :props="props"
  5. node-key="id"
  6. ref="treeForm"
  7. show-checkbox
  8. :default-checked-keys="this.savedPermissionIds"
  9. :default-expanded-keys="this.savedPermissionIds"
  10. @check="getCheckedNodes"
  11. ></el-tree>
  1. showDialog(id) {
  2. this.isShowPermissionTree = true;
  3. this.roleId = id;
  4. this.savedPermissionIds = [];
  5. this.getPermissionTree();
  6. },
  7. //获取用户勾选的权限id用于传参后台
  8. getCheckedNodes() {
  9. // let selectedPermission = this.$refs.treeForm.getCheckedNodes(false, true); //(leafOnly, includeHalfChecked) 接收两个 boolean 类型的参数,1. 是否只是叶子节点,默认值为 false 2. 是否包含半选节点,默认值为 false
  10. // this.permissionIds = selectedPermission.map(item => {
  11. // return item.id;
  12. // });
  13. let parentArr = this.$refs.treeForm.getHalfCheckedKeys();
  14. let childeArr = this.$refs.treeForm.getCheckedKeys();
  15. let arr = childeArr.concat(parentArr);
  16. this.permissionIds = arr;
  17. },
  18. //取消
  19. cancel() {
  20. this.isShowPermissionTree = false;
  21. this.savedPermissionIds = [];
  22. this.getPermissionTree();
  23. },
  24. //获取树形权限列表
  25. getPermissionTree() {
  26. menulistByPid({ flag: 1 }).then(res => {
  27. this.permissionData = res.body;
  28. //获取权限管理配置id并显示
  29. getPermissionIds({ roleId: this.roleId }).then(res => {
  30. this.savedPermissionIds = res.body;
  31. let newArr = [];
  32. let item = "";
  33. if (this.savedPermissionIds && this.savedPermissionIds.length !== 0) {
  34. this.savedPermissionIds.forEach(item => {
  35. this.checked(item, this.permissionData, newArr);
  36. });
  37. this.savedPermissionIds = newArr;
  38. // console.log("this.savedPermissionIds111", this.savedPermissionIds);
  39. }
  40. });
  41. });
  42. },
  43. checked(id, data, newArr) {
  44. data.forEach(item => {
  45. if (item.id == id) {
  46. if (item.items && item.items.length == 0) {
  47. newArr.push(item.id);
  48. }
  49. } else {
  50. if (item.items != null && item.items.length != 0) {
  51. this.checked(id, item.items, newArr);
  52. }
  53. }
  54. });
  55. // console.log("newArr", newArr);
  56. },

element-ui default-checked-keys 会把节点下所有子节点全部勾选解决方法的更多相关文章

  1. bootstrap-treeview 如何实现全选父节点下所有子节点及反选

    转(https://www.augsky.com/992.html) 选中父节点时,父节点下所有子节点也都全部选中 1,HTML代码 <h2>TreeView Checkable</ ...

  2. jQuery 判断父节点下是否有子节点

    查找父节点下是否有子节点有两个情况:(1)查找的是父元素的所有后代节点:(2)仅查找父元素的第一代子节点. <div id="app"> <div> < ...

  3. element ui 弹出组件的遮罩层在弹出层的上面的解决方法

    <el-dialog title="收货地址" :visible.sync="dialogFormVisible" :modal-append-to-bo ...

  4. [SQL]T-Sql 递归查询(给定节点查所有父节点、所有子节点的方法)

    T-Sql 递归查询(给定节点查所有父节点.所有子节点的方法)   -- 查找所有父节点with tab as( select Type_Id,ParentId,Type_Name from Sys_ ...

  5. 在论坛中出现的比较难的sql问题:21(递归问题 检索某个节点下所有叶子节点)

    原文:在论坛中出现的比较难的sql问题:21(递归问题 检索某个节点下所有叶子节点) 最近,在论坛中,遇到了不少比较难的sql问题,虽然自己都能解决,但发现过几天后,就记不起来了,也忘记解决的方法了. ...

  6. mysql 递归查找菜单节点的所有子节点

    背景                                                                                                   ...

  7. T-Sql 递归查询(给定节点查所有父节点、所有子节点的方法)

    -- 查找所有父节点with tab as( select Type_Id,ParentId,Type_Name from Sys_ParamType_V2_0 where Type_Id=316-- ...

  8. configSections必须是根节点下第一个节点

    对webconfig文档进行配置,添加了一个节点configSectionS,添加时,我自个想,按节点的名称以字母排序,就放在appSettings节点下. 谁知,在程序运行时,出现了错误: 参考上面 ...

  9. element Ui的级联选择器 任意一级选中下拉框自动关闭

    封装成一个子组件 <template> <el-cascader v-model="value" clearable placeholder="请选择& ...

随机推荐

  1. typescript装饰器定义 类装饰器 属性装饰器 装饰器工厂

    /* 装饰器:装饰器是一种特殊类型的声明,它能够被附加到类声明,方法,属性或参数上,可以修改类的行为. 通俗的讲装饰器就是一个方法,可以注入到类.方法.属性参数上来扩展类.属性.方法.参数的功能. 常 ...

  2. openresty开发系列1--网关API架构及选型

    微服务架构在项目中的应用越来越多,我们知道在微服务架构风格中,一个大应用被拆分成为了多个小的服务系统提供出来,这些小的系统他们可以自成体系,也就是说这些小系统可以拥有自己的数据库,框架甚至语言等,这些 ...

  3. ISO/IEC 9899:2011 条款6.5.8——关系操作符

    6.5.8 关系操作符 语法 1.relational-expression: shift-expression relational-expression    <    shift-expr ...

  4. ES6深入浅出-4 迭代器与生成器-1.字面量增强

    今天的内容 字面量literal 写出来就是它的值 例如字符串hello.这就是自变量. 一个空对象,也是自变量 写出来就是代表它写出来的那个意思就是自变量. 与其相反的就是构造出来的.例如下面的ne ...

  5. getField和getDeclaredField的区别

    这两个方法都是用于获取字段getField 只能获取public的,包括从父类继承来的字段.getDeclaredField 可以获取本类所有的字段,包括private的,但是不能获取继承来的字段. ...

  6. Java连接MongoDB示例

    示例代码: package com.zifeiy.snowflake.handle.etl.mongodb; import java.util.ArrayList; import java.util. ...

  7. 【Leetcode_easy】1046. Last Stone Weight

    problem 1046. Last Stone Weight 参考 1. Leetcode_easy_1046. Last Stone Weight; 完

  8. 07点睛Spring4.1-BeanPostProcessor

    7.1 BeanPostProcessor spring通过BeanPostProcessor接口可以对所有bean或者指定的某些bean的初始化前后对bean的检查或者修改提供支持; 使用postP ...

  9. 由于我最近搞了个wordpress搭建博客,这里我为大家分享一哈,使用wordpress过程中遇到的坑

    Windows server下搭建mysql+php+apache环境参考教程: https://blog.csdn.net/qq_38125058/article/details/81157865 ...

  10. STM32之中断函数

    本文做中断函数的索引,帮助我们找到中断函数名.中断函数参数以及中断服务函数他们的来源,以便我们编程. 1)如果一个工程只有一个中断,则我们可以进行两个步骤就可以了: 使能中断通道 编写中断服务函数 2 ...