elementui el-tree默认选中
时间: 2023-11-29 19:06:09 浏览: 98
elementUI select组件默认选中效果实现的方法
可以通过设置el-tree组件的default-checked-keys属性来实现el-tree的默认选中。例如:
```html
<el-tree :data="pdfTree" :default-checked-keys="[1, 2]" node-key="id"></el-tree>
```
上述代码中,pdfTree是el-tree的数据源,default-checked-keys属性设置了默认选中的节点的id,node-key属性指定了节点的唯一标识符。
如果想要实现双向绑定,可以使用setCurrentKey方法。例如:
```html
<el-tree :data="pdfTree" :default-checked-keys="checkedKeys" node-key="id" @check-change="handleCheckChange"></el-tree>
```
```javascript
export default {
data() {
return {
pdfTree: [],
checkedKeys: []
}
},
methods: {
handleCheckChange(data, checked) {
this.checkedKeys = data.checkedKeys;
}
}
}
```
上述代码中,通过设置default-checked-keys属性来初始化选中状态,同时监听check-change事件,在事件处理函数中更新checkedKeys数组,从而实现双向绑定。
阅读全文