Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 | import { StyledProps } from "../_type"; export interface TabsProps extends StyledProps { /** * 选项卡列表 */ tabs?: Tab[]; /** * 是否在切换时销毁未激活的 TabPanel * @default true */ destroyInactiveTabPanel?: boolean; /** * 当前选中的选项卡 */ activeId?: string; /** * 当用户激活指定选项卡时回调 */ onActive?: (tab: Tab, evt: React.SyntheticEvent) => void; /** * 默认选中的选项卡。 * 如果已经提供了 `activeId`,此属性会被忽略。 */ defaultActiveId?: string; /** * 在 <Tabs /> 的子节点中: * * - 如果是 <TabPanel />,则只有 `tabId` 和当前 `activeId` 匹配的才会被渲染 * - 如果是其它节点,会直接渲染 */ children?: React.ReactNode; /** * 自定义 TabBar 中项渲染 * * @default children => <a>{children}</a> */ tabBarRender?: (children: JSX.Element, tab: Tab) => JSX.Element; /** * 是否开启切换带动画效果 * @default true */ animated?: boolean; /** * 选项卡书签位置 * @default "top" */ placement?: "top" | "left"; /** * 是否使用 ceiling 样式(搭配 Layout 使用) * @default */ ceiling?: boolean; /** * 在选项卡后可选的内容。可以附加跳转按钮、操作按钮等 */ addon?: React.ReactNode; /** * 垂直(`placement = "left"`)时选项卡容器的最大高度 */ maxHeight?: number; } export interface Tab { /** * 选项卡标签 ID */ id: string; /** * 选项卡标签内容 */ label: React.ReactNode; /** * 如果提供了关闭回调处理函数,则选项卡会渲染关闭按钮,点击时调用 */ onClose?: (tab: Tab, event: React.SyntheticEvent) => void; /** * 禁用当前选项卡 * @default false */ disabled?: boolean; } |