File Explorer Basic - Focus

Learn how to focus File Explorer items.

Imperative API

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

const apiRef = useFileExplorerApiRef();

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

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

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.