在vue2中,使用disabled禁用无效的时候,可以使用如下方法进行使用。
<el-tree
:data="data"
node-key="id">
<div class="custom-tree-node" slot-scope="{ node, data }">
<span>{{ node.label }}</span>
<div v-if="data.disabled" class="disabled" @click.stop></div>
</div>
</el-tree>
在vue3中,使用disabled禁用无效的时候,可以使用如下的方法实现单个节点对应的禁用效果。
<el-tree
ref="treeId"
:data="data"
node-key="id"
default-expand-all
:highlight-current="true"
:props="{
value: 'id',
label: 'label',
children: 'children',
disabled: 'disabled',
}"
@node-click="nodeClick">
<template #default="{ node, data }">
<span class="custom-tree-node">
<span>{{ node.label }}</span>
<div v-if="data.disabled" class="disabled" @click.stop></div>
</span>
</template>
</el-tree>