Browse Source

Fix some style and react key problems

pull/674/head
afc163 9 years ago
parent
commit
b115f000f9
  1. 6
      components/tabs/demo/new-and-close.md
  2. 12
      components/tabs/index.jsx
  3. 2
      style/components/tabs.less

6
components/tabs/demo/new-and-close.md

@ -20,9 +20,9 @@ function newTabPane() {
ReactDOM.render( ReactDOM.render(
<Tabs onChange={callback} type="card" editable newTabPane={newTabPane}> <Tabs onChange={callback} type="card" editable newTabPane={newTabPane}>
<TabPane tab="卡" key="1">选项卡一内容</TabPane> <TabPane tab="选项卡" key="1">选项卡一内容</TabPane>
<TabPane tab="卡" key="2">选项卡二内容</TabPane> <TabPane tab="选项卡" key="2">选项卡二内容</TabPane>
<TabPane tab="卡" key="3">选项卡三内容</TabPane> <TabPane tab="选项卡" key="3">选项卡三内容</TabPane>
</Tabs> </Tabs>
, document.getElementById('components-tabs-demo-new-and-close')); , document.getElementById('components-tabs-demo-new-and-close'));
```` ````

12
components/tabs/index.jsx

@ -53,7 +53,9 @@ class AntTabs extends React.Component {
} }
}); });
if (activeKey === key) { if (activeKey === key) {
activeKey = tabs[foundIndex - 1].key; foundIndex = foundIndex - 1;
foundIndex = foundIndex >= 0 ? foundIndex : 0;
activeKey = tabs[foundIndex].key;
} }
this.setState({ this.setState({
tabs, tabs,
@ -94,10 +96,10 @@ class AntTabs extends React.Component {
children = this.state.tabs; children = this.state.tabs;
} }
// Add new tab handler // Add new tab handler
tabBarExtraContent = [ tabBarExtraContent = <span>
<Icon type="plus" className={prefixCls + '-new-tab'} onClick={this.createNewTab} />, <Icon type="plus" className={prefixCls + '-new-tab'} onClick={this.createNewTab} />
tabBarExtraContent, {tabBarExtraContent}
]; </span>;
} }
// Wrap the extra content // Wrap the extra content
tabBarExtraContent = <div className={prefixCls + '-extra-content'}> tabBarExtraContent = <div className={prefixCls + '-extra-content'}>

2
style/components/tabs.less

@ -397,6 +397,7 @@
margin-right: 0; margin-right: 0;
margin-left: 4px; margin-left: 4px;
font-size: 12px; font-size: 12px;
width: 12px;
color: #999; color: #999;
transition: color 0.3s ease; transition: color 0.3s ease;
&:hover { &:hover {
@ -417,6 +418,7 @@
border-radius: 3px; border-radius: 3px;
border: 1px solid @border-color-base; border: 1px solid @border-color-base;
font-size: 12px; font-size: 12px;
.iconfont-size-under-12px(10px);
transition: color 0.3s ease; transition: color 0.3s ease;
&:hover { &:hover {
color: @primary-color; color: @primary-color;

Loading…
Cancel
Save