为Tabs增加gutter

This commit is contained in:
lixiaoyang1992 2017-12-17 23:47:19 +08:00 committed by 偏右
parent 1eff817b9a
commit 9c52014585
5 changed files with 11 additions and 1 deletions

View File

@ -101,6 +101,11 @@ exports[`Tabs tabPosition remove card 1`] = `
key="1"
onClick={[Function]}
role="tab"
style={
Object {
"marginRight": undefined,
}
}
>
foo
</div>

View File

@ -35,6 +35,7 @@ Ant Design has 3 types of Tabs for different situations.
| onNextClick | Callback executed when next button is clicked | Function | - |
| onPrevClick | Callback executed when prev button is clicked | Function | - |
| onTabClick | Callback executed when tab is clicked | Function | - |
| tabBarGutter | The gap between tabs | number | - |
### Tabs.TabPane

View File

@ -29,6 +29,7 @@ export interface TabsProps {
prefixCls?: string;
className?: string;
animated?: boolean | { inkBar: boolean; tabPane: boolean; };
tabBarGutter?: number;
}
// Tabs
@ -99,6 +100,7 @@ export default class Tabs extends React.Component<TabsProps, any> {
onPrevClick,
onNextClick,
animated = true,
tabBarGutter,
} = this.props;
let { inkBarAnimated, tabPaneAnimated } = typeof animated === 'object' ? {
@ -171,6 +173,7 @@ export default class Tabs extends React.Component<TabsProps, any> {
onPrevClick={onPrevClick}
onNextClick={onNextClick}
style={tabBarStyle}
tabBarGutter={tabBarGutter}
/>
);

View File

@ -38,6 +38,7 @@ Ant Design 依次提供了三级选项卡,分别用于不同的场景。
| onNextClick | next 按钮被点击的回调 | Function | 无 |
| onPrevClick | prev 按钮被点击的回调 | Function | 无 |
| onTabClick | tab 被点击的回调 | Function | 无 |
| tabBarGutter | tabs 之间的间隙 | number | 无 |
### Tabs.TabPane

View File

@ -70,7 +70,7 @@
"rc-steps": "~3.0.0",
"rc-switch": "~1.6.0",
"rc-table": "~6.1.0",
"rc-tabs": "~9.1.2",
"rc-tabs": "~9.2.0",
"rc-time-picker": "~3.2.1",
"rc-tooltip": "~3.7.0",
"rc-tree": "~1.7.0",