-
组件布局 Layout视图 View导航 Navigation反馈 Feedback
页签 Tabsissue v3.0.3- v3.0.3
- v3.0.2
- v3.0.1
- v3.0.0
- v2.1.6
- v2.1.6-nc.0
- v2.1.5
- v2.1.4
- v2.1.3
- v2.1.2
- v2.1.1
- v2.1.0
- v2.0.6
- v2.0.5
- v2.0.4
- v2.0.3
- v2.0.2
- v2.0.1
- v1.0.10
- v1.0.9
- v1.0.8
- v1.0.7
- v1.0.6
- v3.0.3
- v3.0.2
- v3.0.1
- v3.0.0
- v2.1.6
- v2.1.6-nc.0
- v2.1.5
- v2.1.4
- v2.1.3
- v2.1.2
- v2.1.1
- v2.1.0
- v2.0.6
- v2.0.5
- v2.0.4
- v2.0.3
- v2.0.2
- v2.0.1
- v1.0.10
- v1.0.9
- v1.0.8
- v1.0.7
- v1.0.6
分隔内容上有关联但属于不同类别的数据集合。
何时使用
例如：切换不同tab展示不同内容时
如何使用
import { Tabs } from 'tinper-bee';
or
import Tabs from 'bee-tabs';
import 'bee-tabs/build/Tabs.css';
能力特性
API
Tabs
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| activeKey | 设置当前激活的tabPanel的key | String | - |
| tabBarPosition | tab头的定位，可以是['left','right','top','bottom']中选择 | String | - |
| defaultActiveKey | 如果activeKey没有设置的时候，当初始化的时候设置当前激活的tabPanel的key | String | 默认激活第一个 |
| renderTabBar | 怎样去渲染tab的头部 | ():React.Node | - |
| renderTabContent | 怎样去渲染tab的内容区域 | ():React.Node | - |
| onChange | tabPanel改变的时候的回调函数 | (key:string):void | - |
| destroyInactiveTabPane | 是否在更改选项卡时销毁无效标签 | Boolean | false |
| style | 添加到tab上的style | String | u-tabs |
| onTabClick | tab 被点击的回调 | fun | - |
| className | 在tab组件上添加className | String | - |
| extraContent | 在导航上添加扩展元素 | ():React.Node | - |
| onPrevClick | 当出现滚动时，点击上一个时的回调函数 | Function | - |
| onNextClick | 当出现滚动时，点击下一个时的回调函数 | Function | - |
| animated | tab切换时，是否使用动画(1.0.8版本及其以后弃用，动画全部去掉) | bool | false |
| tabBarStyle | tabBar样式选择，可以是['primary','simple','upborder','editable-card']中选择 | String | 'simple' |
| [v2.1.2新增]hideAdd | 是否隐藏加号图标，在 type="editable-card" 时有效 |
boolean | false |
| [v2.1.2新增]onEdit | 新增和删除页签的回调，在 type="editable-card" 时有效 |
(targetKey, action): void | - |
TabPane
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| key | 对应 activeKey | string | - |
| tab | 选项卡头显示文字 | string|ReactNode | - |
| style | 选项卡样式 | Object | - |
| forceRender | 在选项卡中强制渲染内容，而不是在单击选项卡后呈现延迟。 | Boolean | false |
| placeholder | 懒加载时显示的内容 | React:Node | - |
SearchTabs
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| onChange | 数据改变的回调 | func | - |
| value | 被选中的值 | string | - |
SearchTabs.Item
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| value | Item的标示 | string | - |
注意事项
暂无
更新日志
-
v3.0.0 2020-03-20 ( release地址 )
- bee-tabs @3.0.0
- [Update] 重构，支持tabs标签可拖拽。
- bee-tabs @3.0.0
-
v2.1.6 2019-10-30 ( release地址 )
- bee-tabs @2.1.6
- [Fixbug]解决TabPane面板中的事件自动触发tabs组件onChange回调的问题。
- bee-tabs @2.1.6
-
v2.1.5 2019-10-10 ( release地址 )
- bee-tabs @2.1.5
- [Feature]底层支持 DNDclick 事件
- bee-tabs @2.1.5
-
v2.1.3 2019-09-21 ( release地址 )
- bee-tabs @2.1.3
- [Feature]支持自定义属性。
- [Fixbug]解决 max-width 导致的样式问题。
- bee-tabs @2.1.3
-
v2.1.2 2019-09-07 ( release地址 )
- bee-tabs @2.1.2
- [Fixbug]竖向tabs，设置额外元素时，样式错乱的问题。
- [Feature]新增 onEdit API，新增和删除页签的回调，在 tabBarStyle="editable-card" 时有效。
- [Fixbug]解决 onPrevClick、onNextClick 属性无效问题。
- bee-tabs @2.1.2
-
v2.1.1 2019-08-17 ( release地址 )
- bee-tabs @2.1.1
- [bug]解决onTabClick事件无效
- bee-tabs @2.1.1
-
v2.0.6 2019-05-21 ( release地址 )
- bee-tabs @2.0.6
- [Fixbug]解决左侧 Tabs 内嵌套上侧 Tabs 时，数据未显示的问题
- bee-tabs @2.0.6
-
v2.0.5 2019-05-15 ( release地址 )
- bee-tabs @2.0.5
- [Fixbug]解决嵌套表格的子模块为Tabs页签时，表格显示异常问题
- bee-tabs @2.0.5
-
v2.0.4 2019-04-16 ( release地址 )
- [Feature]bee-tabs @2.0.4
- 去掉u-tabs-content内容区的height:100%
- [Feature]bee-tabs @2.0.4
-
v2.0.3 2019-04-01 ( release地址 )
- [Feature]bee-tabs @2.0.3，规范顶部border样式
-
v2.0.2 2019-03-18 ( release地址 )
bee-tabs @2.0.2更新内容
- [Feature]bee-tabs @2.0.2，优化 bee-tabs 组件交互体验及对应示例
北京市海淀区北清路68号用友产业园
guoyff@yonyou.com