字节跳动的ArcoDesign框架里用tree树选择组件,通过:tree-props="{'default-expand-all':false}"关闭节点默认展开,怎么在搜索时展开节点
时间: 2024-03-03 08:48:20 浏览: 328
vue el-tree 默认展开第一个节点的实现代码
5星 · 资源好评率100%
在 ArcoDesign 框架中,通过 `tree-props` 属性来设置 Tree 树选择组件的默认展开状态。如果想要在搜索时展开节点,可以通过以下步骤来实现:
1. 在 Tree 树选择组件上添加 `ref` 属性,用于获取组件实例。
```
<a-tree ref="tree" :tree-data="treeData" :tree-props="{'default-expand-all':false}"></a-tree>
```
2. 在搜索框的 `on-search` 事件中,获取 Tree 树选择组件实例,并调用 `expandAll` 方法展开所有节点。
```
<a-input-search @on-search="onSearch"></a-input-search>
...
methods: {
onSearch(value) {
// 获取 Tree 树选择组件实例
const tree = this.$refs.tree;
// 展开所有节点
tree.expandAll();
}
}
```
这样,在搜索框中输入关键字后,就可以展开所有含有该关键字的节点了。
阅读全文