当orientation为horizontal时, 支持反转模式. 可以实现底部导航布局.
| 属性名 | 类型 | 是否必须 | 默认值 | 说明 |
|---|---|---|---|---|
| activateTabWithKeyboard | boolean | undefined | no | true | Determines whether tab should be activated with arrow key press |
| allowTabDeactivation | boolean | undefined | no | false | Determines whether tab can be deactivated |
| children | React.ReactNode | no | Tabs content | |
| color | string | undefined | no | "primary" | Changes colors of <code>Tabs.Tab</code> components when variant is <code>pills</code> or <code>default</code>, does nothing for other variants |
| defaultValue | string | null | undefined | no | Default value for uncontrolled component | |
| id | string | undefined | no | Base id, used to generate ids to connect labels with controls, generated randomly by default | |
| inverted | boolean | undefined | no | false | Determines whether tabs should have inverted styles |
| keepMounted | boolean | undefined | no | true | If set to <code>false</code>, <code>Tabs.Panel</code> content will be unmounted when the associated tab is not active |
| loop | boolean | undefined | no | true | Determines whether arrow key presses should loop though items (first to last and last to first) |
| onChange | ((value: string | null) => void) | undefined | no | Called when value changes | |
| orientation | "horizontal" | "vertical" | undefined | no | 'horizontal' | Tabs orientation |
| placement | "left" | "right" | undefined | no | 'left' | <code>Tabs.List</code> placement relative to <code>Tabs.Panel</code>, applicable only when <code>orientation="vertical"</code> |
| radius | string | undefined | no | 'md' | "xs","sm","md","lg" or any valid CSS value to set <code>border-radius</code> |
| value | string | null | undefined | no | Value for controlled component | |
| variant | "outline" | "default" | "pills" | undefined | no | 'default' | variant |