Controlling the State

The PanelBar allows you to set an initial selection, expansion, or focus state, and override the selection every time a PanelBar item is selected.

The state of the PanelBar can be controlled by either:

• An internally generated uniquePrivateKey.
• User generated unique id available in each PanelBar item.

Set the initial state of the PanelBar using internal key

To set the initial state of the PanelBar, provide uniquePrivateKey values to the selected, expanded, and focused properties.

The uniquePrivateKey option is generated by the component itself and adopts a specific pattern that applies to each PanelBarItem:

• The generation starts from the first item, which is '.0'. The items from the same level of depth are generated respectively as '.1', '.2', and so on.
• The children of the first item are respectively '.0.0', '.0.1', '.0.2', and so on.

Set the initial state of the PanelBar using custom IDs

To set the initial state of the PanelBar using custom IDs, provide the id values of the PanelBar items to the selected, expanded, and focused properties.

Suggested Links

• API Reference of the PanelBar
• API Reference of the PanelBarItem