mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-13 15:49:10 +08:00
1.3 KiB
1.3 KiB
order | title | ||||
---|---|---|---|---|---|
7 |
|
zh-CN
内置的目录树,multiple
模式支持 ctrl(Windows)
/ command(Mac)
复选。
en-US
Built-in directory tree. multiple
support ctrl(Windows)
/ command(Mac)
selection.
import { Tree } from 'antd';
import type { DataNode, DirectoryTreeProps } from 'antd/es/tree';
import React from 'react';
const { DirectoryTree } = Tree;
const treeData: DataNode[] = [
{
title: 'parent 0',
key: '0-0',
children: [
{ title: 'leaf 0-0', key: '0-0-0', isLeaf: true },
{ title: 'leaf 0-1', key: '0-0-1', isLeaf: true },
],
},
{
title: 'parent 1',
key: '0-1',
children: [
{ title: 'leaf 1-0', key: '0-1-0', isLeaf: true },
{ title: 'leaf 1-1', key: '0-1-1', isLeaf: true },
],
},
];
const App: React.FC = () => {
const onSelect: DirectoryTreeProps['onSelect'] = (keys, info) => {
console.log('Trigger Select', keys, info);
};
const onExpand: DirectoryTreeProps['onExpand'] = (keys, info) => {
console.log('Trigger Expand', keys, info);
};
return (
<DirectoryTree
multiple
defaultExpandAll
onSelect={onSelect}
onExpand={onExpand}
treeData={treeData}
/>
);
};
export default App;