@@ -363,6 +393,63 @@ Used for node selection. In the following example, data for each layer is acquir
...
@@ -363,6 +393,63 @@ Used for node selection. In the following example, data for each layer is acquir
```
```
:::
:::
### Disabled checkbox
The checkbox of a node can be set as disabled.
::: demo In the example, 'disabled' property is declared in defaultProps, and some nodes are set as 'disabled:true'. The corresponding checkboxes are disabled and can't be clicked.
```html
<el-tree
:data="data3"
:props="defaultProps"
show-checkbox
@check-change="handleCheckChange">
</el-tree>
<script>
exportdefault{
data(){
return{
data3:[{
id:1,
label:'Level one 1',
children:[{
id:3,
label:'Level two 2-1',
children:[{
id:4,
label:'Level three 3-1-1'
},{
id:5,
label:'Level three 3-1-2',
disabled:true
}]
},{
id:2,
label:'Level two 2-2',
disabled:true,
children:[{
id:6,
label:'Level three 3-2-1'
},{
id:7,
label:'Level three 3-2-2',
disabled:true
}]
}]
}],
defaultProps:{
children:'children',
label:'label',
disabled:'disabled',
},
};
}
};
</script>
```
:::
### Default expanded and default checked
### Default expanded and default checked
Tree nodes can be initially expanded or checked
Tree nodes can be initially expanded or checked
...
@@ -789,8 +876,9 @@ Only one node among the same level can be expanded at one time.
...
@@ -789,8 +876,9 @@ Only one node among the same level can be expanded at one time.
