antd的Tree组件页面加载后默认选中一项
时间: 2024-12-18 11:19:21 浏览: 5
antd Tree组件 搜索标红 例子
5星 · 资源好评率100%
Ant Design (antd) 的 Tree 组件支持通过设置 `defaultSelectedKeys` 或 `defaultCheckedKeys` 属性来指定树节点的默认选中状态。当你需要页面加载后自动选中一项时,可以在渲染 Tree 的时候提供一个数组,包含你要选中的键值。
例如,在jsx代码中,你可以这样做:
```jsx
import { Tree } from 'antd';
const defaultKey = ['0']; // 这里假设你有一个名为 '0' 的初始选中项
function App() {
return (
<Tree
defaultSelectedKeys={defaultKey}
// 如果你想设置默认选中的复选框,可以使用 defaultCheckedKeys
// defaultCheckedKeys={['0', '1']} // 如果有多个已选中的项
/>
);
}
```
如果你想要在数据加载完成后动态设置默认选中项,你可以先不设置,默认在节点的数据加载完成后再更新这个属性。例如,在组件的 `componentDidMount` 或者 `useEffect` 中进行操作。
阅读全文