Vue Element UI el-tree 实例 获取 tree show-checkbox 选中子节点 (解析)

Forever


el-tree

默认选中节点 default-checked-keys
:data  属性数据集
show-checkbox  展示多选框
:props 属性组件配置
<br>

解析

getCheckedKeys

若节点可被选择(即show-checkboxtrue),则返回目前被选中的节点的 key 所组成的数组

(leafOnly) 接收一个 boolean 类型的参数,若为true则仅返回被选中的叶子节点的 keys,默认值为false

<template>
    <div>
    
    <button @click="gettreenode">获取选中节点</button>
    
        <el-tree
            :default-checked-keys="tree_checked"
            :data="role.tree_list"
            show-checkbox 
            node-key="id"
            :props="defaultProps"
            ref="tree">
        </el-tree>
    </div>
</template>
<script>
   export default{
       name:'tree',
       data(){ 
               defaultProps: {
                   children: 'children',
                   label: 'name'
               }
           }
       },methods:{
           gettreenode(){
           //获取选中属性节点
           console>log(this.refs.tree.getCheckedKeys());
           }
       }
   }
</script>
阅读 3.9k

Forever 个人博客
博客主页 [链接] CSDN [链接]
1 声望
0 粉丝
0 条评论
1 声望
0 粉丝
文章目录
宣传栏