NavigationTabsBar Navigation Tabs Bar

系统布局

Tab items / Tab 项列表

何时使用

适用于Navigation Tabs Bar相关场景。

tsx

import { NavigationTabsBar } from "@chaos_team/chaos-ui/layout"

export function Basic() {
return <NavigationTabsBar />
}

Prop	Type	Default	说明
`className`	`string`	—	自定义样式类名
`items`	`NavigationTabsBarTabItem[]`	—	Tab items / Tab 项列表
`activeKey`	`string`	—	Active tab key / 当前激活的 tab key
`defaultActiveKey`	`string`	—	Default active tab key (uncontrolled) / 默认激活的 tab key（非受控）
`onChange`	`() => void`	—	Tab change callback / Tab 切换回调
`onClose`	`() => void`	—	Tab close callback / Tab 关闭回调
`onCloseAll`	`() => void`	—	Close all tabs callback / 关闭全部回调
`onCloseOthers`	`() => void`	—	Close other tabs callback / 关闭其他回调
`onCloseToRight`	`() => void`	—	Close tabs to the right callback / 关闭右侧回调
`onRefresh`	`() => void`	—	Refresh tab callback / 刷新回调
...rest	`React.HTMLAttributes`	—	透传原生 DOM 属性

📘 完整交互式示例与控件属性请查看 Storybook 文档。