z 获取el-tree选中节点id
vue elementUI tree树形控件获取父节点ID的实例
修改源码:
情况1: element-ui没有实现按需引入打包
node_modules\element-ui\lib\element-ui.common.js 25382行修改源码 去掉 'includeHalfChecked &&'
// if ((child.checked || includeHalfChecked && child.indeterminate) && (!leafOnly || leafOnly && child.isLeaf)) {
if ((child.checked || child.indeterminate) && (!leafOnly || leafOnly && child.isLeaf)) {
情况2: element-ui实现了按需引入打包
node_modules\element-ui\lib\tree.js 1051行修改源码 去掉 'includeHalfChecked &&'
// if ((child.checked || includeHalfChecked && child.indeterminate) && (!leafOnly || leafOnly && child.isLeaf)) {
if ((child.checked || child.indeterminate) && (!leafOnly || leafOnly && child.isLeaf)) {
*/
<el-tree
default-expand-all
:expand-on-click-node="false"
:data="ruleList"
:props="defaultProps"
style="width: 100%"
show-checkbox
@check-change="handleCheckChange"
ref="tree"
node-key="rule_id"
>
<span class="custom-tree-node" slot-scope="{ node, data }">
<div>
<span>{{ data.rule_name }}</span>
<span v-if="data.rule_type == 1" class="badge ml-1">{{
data.rule_desc
}}</span>
<span v-else class="badge badge-secondary ml-1">{{
data.rule_desc
}}</span>
</div>
</span>
</el-tree>
// 编辑角色权限
async editRoleRule() {
// 获取el-tree选中的节点
var ids = this.$refs.tree.getCheckedKeys();
// console.log(ids);
// 提交设置到后端
let result = await this.$api.user.reqEditRoleRule(this.role_id, ids);
// console.log(result);
if (result.code == 200) {
this.$message({
type: "success",
message: result.msg,
});
this.drawer = false;
}
},
// 打开抽屉
openDrawer(row) {
this.role_id = row.role_id;
this.$api.user.reqRoleFind(row.role_id).then((result) => {
if (result.code == 200) {
let list = result.data.list.map((item) => {
return item.rule_id;
});
this.drawer = true;
this.$nextTick(() => {
// console.log(that.$refs.tree);
// 先清除之前的选中的
this.$refs.tree.setCheckedKeys([]);
// 在选中现在该有的权限
list.forEach((i, n) => {
var node = this.$refs.tree.getNode(i);
if (node.isLeaf) {
this.$refs.tree.setChecked(node, true);
}
});
});
}
});
},
免责申明：
1. 本站所有教程、文章或资源分享目的仅供大家学习和交流！
2. 如有无法查看或链接失效，麻烦请报告联系管理员处理！
3. 本站无法保证资源或其时效性，恕不接受任何提问。
4. 在本站下载的源码严禁杜绝任何形式的正式商业用途，请去程序官方购买。 所有资料均来自于网络，版权归原创者所有！本站不提供任何保证，并不承担任何法律责任，如果对您的版权或者利益造成损害，请提供相应的资质证明，我们将于3个工作日内予以删除。
