码迷,mamicode.com
首页 > 其他好文 > 详细

Element-ui中Tree的使用,以及全选反选获取id

时间:2020-09-17 19:26:59      阅读:38      评论:0      收藏:0      [点我收藏+]

标签:mode   reac   点击   color   func   each   children   hand   next   

<el-checkbox v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
                <el-tree
                    :data="data"
                    show-checkbox
                    default-expand-all
                    node-key="module_id"
                    ref="tree"
                    highlight-current
                    :props="defaultProps"
                    @check="nodeClick"
                ></el-tree>
data() {
        return {
            checkAll: false,
            select_box: [],
            data: [], //tree
            defaultProps: {
                children: child,
                label: module_name
            }
        };
    },
 handleCheckAllChange(val) {
            if (this.checkAll) {
//全选
this.$nextTick(function () { this.$refs.tree.setCheckedNodes(this.data); }); } else {
//反选
this.$nextTick(function () { this.$refs.tree.setCheckedKeys([]); }); } this.$nextTick(function () {
//获取id let select_box
= []; this.$refs.tree.getCheckedNodes().forEach((item) => { select_box.push(item.module_id); }); this.select_box = select_box; // console.log(this.select_box, ‘select_box888‘); }); }, nodeClick(data, node, e) {
//点击的时候获取到所有选中的
// console.log(this.$refs.tree.getCheckedNodes(), ‘console.log(this.$refs.tree.getCheckedNodes());‘); let select_box = []; this.$refs.tree.getCheckedNodes().forEach((item) => { select_box.push(item.module_id); }); this.select_box = select_box; console.log(this.select_box, select_box); },

 

Element-ui中Tree的使用,以及全选反选获取id

标签:mode   reac   点击   color   func   each   children   hand   next   

原文地址:https://www.cnblogs.com/xiaoxiaoxun/p/13637302.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!