简单树状视图 - 展开

了解如何处理树状视图项目的展开和折叠。

受控展开

使用 expandedItems prop 来控制展开的项目。您还可以使用 onExpandedItemsChange prop 来监听展开项目的更改并相应地更新 prop。

跟踪项目展开更改

使用 onItemExpansionToggle prop 以在项目展开时触发操作。

限制展开到图标容器

您可以使用 expansionTrigger prop 来决定展开交互是否应通过单击图标容器而不是整个树状视图项目内容来触发。

命令式 API

更改项目展开

使用 setItemExpansion API 方法来更改项目的展开。

apiRef.current.setItemExpansion(
  // The DOM event that triggered the change
  event,
  // The id of the item to expand or collapse
  itemId,
  // If `true` the item will be expanded
  // If `false` the item will be collapsed
  isExpanded,
);

API

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

• <SimpleTreeView />
• <TreeItem />