Simple Tree View - Focus

Learn how to focus Tree View items.

Imperative API

To use the apiRef object, you need to initialize it using the useTreeViewApiRef hook as follows:

const apiRef = useTreeViewApiRef();

return <SimpleTreeView apiRef={apiRef}>{children}</SimpleTreeView>;

When your component first renders, apiRef will be undefined. After this initial render, apiRef holds methods to interact imperatively with the Tree View.

Focus a specific item

Use the focusItem API method to focus a specific item.

apiRef.current.focusItem(
  // The DOM event that triggered the change
  event,
  // The ID of the item to focus
  itemId,
);

API

See the documentation below for a complete reference to all of the props and classes available to the components mentioned here.