简易树形视图 - 自定义

了解如何自定义简易树形视图组件。

基础知识

使用 collapseIcon 插槽、expandIcon 插槽和 defaultEndIcon 属性来自定义树形视图图标。下面的演示展示了如何使用现有的图标库（例如 Material Icons）以及使用 Material UI 的 SVG Icon 组件从头开始创建图标来添加图标。

在 Tree Item 上使用 groupTransition 插槽来传递一个处理动画的组件。

下面的演示使用 Material UI 的 Collapse 组件以及 react-spring 库实现了动画效果。

使用 treeItemClasses 定位 Tree Item 组件的内部元素并更改其样式。

您可以使用 Tree Item 的自定义 API 来构建新的布局和管理行为。

在 Tree Item 自定义页面上了解有关 Tree Item 的结构以及提供的自定义实用程序的更多信息。

使用 useTreeItem2 Hook 创建您自己的组件。下面的演示展示了如何添加头像和自定义排版元素。

定位 treeItemClasses.groupTransition 类以在树形视图项目之间添加连接边框。

Google Gmail 的侧边导航可能是 Web 上最著名的树形视图组件之一。下面的演示展示了如何复制它。

Gmail 侧边栏是树形视图最著名的示例之一。下面的演示展示了如何使用树形视图组件重新创建它

请参阅下面的文档，以获得此处提及的组件的所有属性和类的完整参考。