TabsLayout 选项卡

让用户可以在不同子任务、视图、模式之间切换，它具有全局导航的作用，是全局功能的主要展示和切换区域。

何时使用

• 当需要对页面内容进行分类或区隔时使用。
• 当需要对页面控件进行压缩，提升页面空间利用率时。

组件示例

组件属性

属性	说明	类型	默认值
contentPadding	设定内容区的内间距，请输入 CSS padding 值	string	'20px 20px'
excessMode	选项卡过多时的滑动模式，slide：滑动、dropdown：下拉选择	'slide' | 'dropdown'	'slide'
extraRender	渲染导航栏附加内容	() => ReactNode	-
items	可以设置默认激活选项、禁用选项和标签名	TabItem[]	-
needBadge	开启徽标	boolean	false
onTabChange	选项卡切换事件	(activeIndex: number, key: string) => void	-
renderBadge	徽标渲染	(tabItem: object) => ReactNode	-
shape	设置选项卡形态	'pure' | 'wrapped' | 'text' | 'capsule'	'pure'
size	标签项大小	'small' | 'medium'	'medium'
tabPosition	导航选项卡的位置	'top' | 'bottom' | 'left' | 'right'	'top'
tabRender	自定义渲染选项卡	(key: string, props: object) => ReactNode	-