首页 > 其他 > 详细

el-tree知识积累

时间:2019-06-06 14:09:41      阅读:127      评论:0      收藏:0      [点我收藏+]
<el-tree :data="treedatalist" show-checkbox default-expand-all :check-strictly="true" node-key="id" ref="tree" :default-checked-keys="mycheckedkeys" @check-change="handleCheckChange"
           :render-content="renderContent">
:props="defaultProps">
</el-tree>
method:{
renderContent (h, { node, data, store }) {
return (
<span class="custom-tree-node">
<span>{node.label}&nbsp;&nbsp;</span>
<span>
<el-button size="mini" type="text" icon="el-icon-delete" on-click={() => this.remove(node, data)}></el-button>
<el-button size="mini" type="text" icon="el-icon-edit" on-click={() => this.edit(node, data)}></el-button>
</span>
</span>);
},
}

:check-strictly="true" 选择父节点时子节点不会被一起选中

:default-checked-keys="mycheckedkeys" 设置默认选中的节点

this.$refs.tree.getCheckedKeys() 获取被选中节点的id

:render-content="renderContent"> 渲染el-tree renderContent增加删除、编辑节点的按钮

el-tree知识积累

原文:https://www.cnblogs.com/cekong/p/10984517.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!