<el-tree
:data="authData"
show-checkbox
:check-strictly="true"
:check-on-click-node="true"
node-key="_id"
ref="yourTreeId"
@check-change="getCheckedKeys"
highlight-current :props="defaultProps"
:filter-node-method="filterAuthData"
@check="handleCheck"
>
</el-tree>

  

 methods: {
//点击父级展开所有子菜单
handleCheck(data){
let expandedData = this.$refs.yourTreeId.store.nodesMap;
expandedData[data._id].expanded = true;
if(data?.children?.length){ //有多少层子集,循环多少次
data?.children?.map(obj=>{
expandedData[obj._id].expanded = true;
if(obj?.children?.length){
obj.children.map(obj2=>{
expandedData[obj2._id].expanded = true;
})
}
})
}
}, }

  

el-tree 点击父级或者父级的checkbox,展开所有子集的更多相关文章

  1. 请问:关于织梦dedecms点击导航上的父栏目进去默认显示第一个子栏目的列表的问题

    要设置织梦dedecms点击导航上的父栏目进去默认显示第一个子栏目的列表, 就按照如下图所示的方法进行操作,为什么 点击导航上的父栏目出现死循环呢, 根本浏览不了网页. 请各位大神指点指点,为什么点击 ...

  2. 通过父级id获取到其下所有子级(无穷级)——Mysql函数实现

    [需求]某用户只能查看其自己信息及其下级信息,涉及通过该用户所在部门获取其下所有部门(多层)id集合. 步骤一:对数据库进行设置: set global log_bin_trust_function_ ...

  3. react第六单元(react组件通信-父子组件通信-子父组件通信-跨级组件的传参方式-context方式的传参)

    第六单元(react组件通信-父子组件通信-子父组件通信-跨级组件的传参方式-context方式的传参) #课程目标 1.梳理react组件之间的关系 2.掌握父子传值的方法 3.掌握子父传值的方法 ...

  4. Vue父子组件通信(父级向子级传递数据、子级向父级传递数据、Vue父子组件存储到data数据的访问)

    Vue父子组件通信(父级向子级传递数据.子级向父级传递数据.Vue父子组件存储到data数据的访问) 一.父级向子级传递数据[Prop]: ● Prop:子组件在自身标签上,使用自定义的属性来接收外界 ...

  5. 通过$broadcast或$emit在子级和父级controller之间进行值传递

    通过$broadcast或$emit在controller之间进行值传递,不过这些controller必须是子级或者父级关系, $emit只能向父级parent controller传递事件event ...

  6. jquery点击li 获取当前父节点所在类的索引

    jquery点击li 获取当前父节点所在类的索引 $('.jbcz').find('.content li').click(function(){ //alert($('.jbcz').find('. ...

  7. js input复选框选中父级同时子级也选中

    js实现复选框选中父级元素子级元素也选中,没有子级元素选中父级也不选中的效果 HTML <tr> <td> <label> <input name=" ...

  8. angularJs 自定义指令传值---父级与子级之间的通信

    angularJs自定义指令用法我忽略,之前有写过,这里只说一下父子级之间如何传值: 例如: 模块我定义为myApp,index.html定义 <my-html bol-val="bo ...

  9. 递归方式---通过子级id,获取子级和父级Name

    #region 递归--返回 父级|子级 名称 #region --返回 父级|子级 名称 public string RetrurnTypeNames(string TypeId) { String ...

  10. 使用jquery获取父元素或父节点

    使用jquery获取父元素或父节点,比较简单,jquery提供了丰富的方法来让我们使用jquery获取父元素或父节点   jquery获取父元素方法比较多,比如parent(),parents(),c ...

随机推荐

  1. 从 Cloud-Native Relational DB 看数据库设计

    论文内容:Amazon Aurora: Design Considerations for HighThroughput Cloud-Native Relational Databases 里面介绍了 ...

  2. bbs大作业

    1.项目开发基本流程 1.需求分析 2.架构设计 3.分组开发 4.提交测试 5.交付上线 2.项目流程 仿造博客园项目(核心:文章的增删改查) 1.表分析: 1.1用户表 1.2个人站点表 1.3文 ...

  3. springcloud-alibaba

    1.spring cloud alibaba官网 https://spring.io/projects/spring-cloud-alibaba#overview 2.spring cloud ali ...

  4. 学习Java Day7

    今天学习了if语句和C/C++基本无差异,也再次练了一下Java的输入

  5. vant组件,picker时间选择,自定义时间选择,实现datePacker,时间选择长期,增加长期选项,用于选择身份证到期时间等...

    vant组件,picker时间选择,自定义时间选择,实现datePacker,时间选择长期,增加长期选项,用于选择身份证到期时间等... 最近项目中有个需求,datePicker选项,需要实现增加一个 ...

  6. HGAME_2023_WEB_WP_WEEK3

    Ping to the host 很明显的rce,简单测试一下发现空格,cat,:被办,且执行无回显,空格用${IFS},%09,$IFS$9等等来绕过,我们利用dnslog将执行结果外带出来,这里使 ...

  7. Vue中v-model与:value的区别

    v-model不可以加其他值 <input type="text" v-model="curAmount"> :value可以加 单位 <in ...

  8. log 函数

    什么是对数 对数用 log 符号来表示.根据底数的不同,log 可以变换成 lg.ln.lg 是以 10 为底的对数,ln 是以 e 为底的对数. logax=y,是一个以 a 为底,x 为真数的对数 ...

  9. JSP 与 Servlet 之间的联系,及其语法

    JSP 是什么 JSP 将 Java 代码和特定变动内容嵌入到静态的页面中,实现以静态页面为模板,动态生成其中的部分内容.JSP 文件在运行时会被其编译器转换成更原始的 Servlet 代码.JSP ...

  10. SpringBoot 面试问答总结(VIP典藏版),最详细!全面!爆肝!

    最详细的SpringBoot面试问题干货,点赞收藏慢慢看 1.SpringBoot 面试问答总结 Spring Boot 是 Spring 开源组织下的子项目,是 Spring 组件一站式解决方案,主 ...