import React, { useState } from 'react'; import { Tree } from 'antd'; import type { TreeDataNode } from 'antd'; const treeData: TreeDataNode[] = [ { title: '0-0', key: '0-0', children: [ { title: '0-0-0', key: '0-0-0', children: [ { title: '0-0-0-0', key: '0-0-0-0' }, { title: '0-0-0-1', key: '0-0-0-1' }, { title: '0-0-0-2', key: '0-0-0-2' }, ], }, { title: '0-0-1', key: '0-0-1', children: [ { title: '0-0-1-0', key: '0-0-1-0' }, { title: '0-0-1-1', key: '0-0-1-1' }, { title: '0-0-1-2', key: '0-0-1-2' }, ], }, { title: '0-0-2', key: '0-0-2', }, ], }, { title: '0-1', key: '0-1', children: [ { title: '0-1-0-0', key: '0-1-0-0' }, { title: '0-1-0-1', key: '0-1-0-1' }, { title: '0-1-0-2', key: '0-1-0-2' }, ], }, { title: '0-2', key: '0-2', }, ]; const App: React.FC = () => { const [expandedKeys, setExpandedKeys] = useState(['0-0-0', '0-0-1']); const [checkedKeys, setCheckedKeys] = useState(['0-0-0']); const [selectedKeys, setSelectedKeys] = useState([]); const [autoExpandParent, setAutoExpandParent] = useState(true); const onExpand = (expandedKeysValue: React.Key[]) => { console.log('onExpand', expandedKeysValue); // if not set autoExpandParent to false, if children expanded, parent can not collapse. // or, you can remove all expanded children keys. setExpandedKeys(expandedKeysValue); setAutoExpandParent(false); }; const onCheck = (checkedKeysValue: React.Key[]) => { console.log('onCheck', checkedKeysValue); setCheckedKeys(checkedKeysValue); }; const onSelect = (selectedKeysValue: React.Key[], info: any) => { console.log('onSelect', info); setSelectedKeys(selectedKeysValue); }; return ( ); }; export default App;