React Native Mantine › Data display
Tree
Hierarchical list with expand, select and checkbox support
Import: import { Tree } from 'react-native-mantine';
Usage
import { Tree, useTree } from 'react-native-mantine';
import type { TreeNodeData } from 'react-native-mantine';
const data: TreeNodeData[] = [
{
value: 'src',
label: 'src',
children: [
{ value: 'src/index.tsx', label: 'index.tsx' },
],
},
];
const tree = useTree();
<Tree data={data} tree={tree} selectOnClick />
// Programmatic control
tree.expandAllNodes();
tree.checkNode('src');
tree.isNodeChecked('src');
tree.isNodeIndeterminate('src');
Props
| Prop | Type | Default | Description |
|---|---|---|---|
label (required) | React.ReactNode | Node label | |
value (required) | string | Unique node value | |
nodeProps | Record<string, any> | Props passed to the rendered node | |
children | TreeNodeData[] | Child nodes |