Element-ui中tree树形控件全选与取消全选的功能实现
Element-ui中tree树形控件全选与取消全选的功能实现//树形控件<div align="right"><el-checkbox v-model="checked" @change="checkedAll"/> 全选/反选</div><el-tree :data="vuetree" ref="vuetree" show-checkbox node-
·
Element-ui中tree树形控件全选与取消全选的功能实现
//树形控件
<div align="right">
<el-checkbox v-model="checked" @change="checkedAll"/> 全选/反选
</div>
<el-tree :data="vuetree" ref="vuetree" show-checkbox node-key="code" default-expand-all :default-checked-keys="checkedKeys" :props="defaultProps">
</el-tree>
//data里面的内容
vuetree: [], //存放树形组件的data
checked:false, //checkbox的值
defaultProps: {
children: 'children',
label: 'name'
},
//checkbox选择事件
checkedAll(){
if (this.checked) {
//全选
this.$refs.vuetree.setCheckedNodes(this.vuetree);
}else{
//取消选中
this.$refs.vuetree.setCheckedKeys([]);
}
},
//附
Element-ui文档
————————————————
版权声明:本文为CSDN博主「zq980328」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/zq980328/article/details/87512967
更多推荐
已为社区贡献36条内容
所有评论(0)