Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 22 additions & 0 deletions .eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
const base = require('@umijs/fabric/dist/eslint');

module.exports = {
...base,
rules: {
...base.rules,
'react/sort-comp': 0,
'react/no-array-index-key': 0,
'react/no-access-state-in-setstate': 0,
'no-plusplus': 0,
'no-param-reassign': 0,
'react/require-default-props': 0,
'react/require-default-props': 0,
'no-underscore-dangle': 0,
'react/no-find-dom-node': 0,
'no-mixed-operators': 0,
'prefer-destructuring': 0,
'react/no-unused-prop-types': 0,
'max-len': 0,
'brace-style': 0,
},
};
8 changes: 8 additions & 0 deletions .fatherrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
export default {
cjs: "babel",
esm: { type: "babel", importLibToEs: true },
preCommit: {
eslint: true,
prettier: true
}
};
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
.storybook
*.iml
*.log
*.log.*
Expand Down
14 changes: 14 additions & 0 deletions .prettierrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
{
"singleQuote": true,
"trailingComma": "all",
"printWidth": 100,
"proseWrap": "never",
"overrides": [
{
"files": ".prettierrc",
"options": {
"parser": "json"
}
}
]
}
7 changes: 1 addition & 6 deletions .travis.yml
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ notifications:
- hust2012jiangkai@gmail.com

node_js:
- 6.0.0
- 10

before_install:
- |
Expand All @@ -30,11 +30,6 @@ env:
- TEST_TYPE=lint
- TEST_TYPE=test
- TEST_TYPE=coverage
- TEST_TYPE=saucelabs
global:
- secure: S1VwbaPzLnSH/IUT/wlJulxAX5VHRIDmSt53h/ycHcZsszUpWcLCJRQAe0fTVB2dAx5MdBbSZ+o+tr3tRwVB5TRAYm0oTCsYAkOZaWOB28RuUQtdGt3wf9xxTG1UiPiaLLUW3waX9zAaf3yqKBcJGf1op0RD8dksxbCFw/7xVbU=
- secure: EBEDg8k///IlEsnx0AE8X3mbFl0QE5+xGKbG4AxXlGZda12uTIPUSMKJzdZQ2hVbZXduTzf1cQl9rcu9nGoSnkL/DWnIax9cvHi+1orx5+YPlxPHNWAwWByTnHosBn2MJhfy1s5paJfHC9cUzmmEL6x4fYthWxjsPUo+irEZH6E=

matrix:
allow_failures:
- env: "TEST_TYPE=saucelabs"
1 change: 0 additions & 1 deletion examples/activeKey.html

This file was deleted.

40 changes: 20 additions & 20 deletions examples/activeKey.js
Original file line number Diff line number Diff line change
@@ -1,13 +1,16 @@
/* eslint react/no-multi-comp:0, no-console:0, react/prop-types:0 */
import 'rc-tabs/assets/index.less';
/* eslint-disable no-console,react/button-has-type */
import '../assets/index.less';
import React from 'react';
import ReactDOM from 'react-dom';
import Tabs, { TabPane } from 'rc-tabs';
import TabContent from 'rc-tabs/lib/SwipeableTabContent';
import ScrollableInkTabBar from 'rc-tabs/lib/ScrollableInkTabBar';
import Tabs, { TabPane } from '../src';
import TabContent from '../src/SwipeableTabContent';
import ScrollableInkTabBar from '../src/ScrollableInkTabBar';

const PanelContent = ({ id }) => (
<div>{[1, 2, 3, 4].map(item => <p key={item}>{id}</p>)}</div>
<div>
{[1, 2, 3, 4].map(item => (
<p key={item}>{id}</p>
))}
</div>
);

class Demo extends React.Component {
Expand All @@ -16,41 +19,41 @@ class Demo extends React.Component {
start: 0,
};

onChange = (activeKey) => {
onChange = activeKey => {
console.log(`onChange ${activeKey}`);
this.setState({
activeKey,
});
}
};

onTabClick = (key) => {
onTabClick = key => {
console.log(`onTabClick ${key}`);
if (key === this.state.activeKey) {
this.setState({
activeKey: '',
});
}
}
};

tick = () => {
this.setState({
start: this.state.start + 10,
});
}
};

handleNotExistKey = () => {
this.setState({
activeKey: '-1',
});
}
};

render() {
const start = this.state.start;
const { start } = this.state;
return (
<div style={{ margin: 20 }}>
<h1>Simple Tabs</h1>
<Tabs
renderTabBar={() => <ScrollableInkTabBar onTabClick={this.onTabClick}/>}
renderTabBar={() => <ScrollableInkTabBar onTabClick={this.onTabClick} />}
renderTabContent={() => <TabContent animatedWithMargin />}
activeKey={this.state.activeKey}
onChange={this.onChange}
Expand All @@ -69,14 +72,11 @@ class Demo extends React.Component {
</TabPane>
</Tabs>
<button onClick={this.tick}>rerender</button>
<button onClick={this.handleNotExistKey}
style={{ marginLeft: 10 }}
>
<button onClick={this.handleNotExistKey} style={{ marginLeft: 10 }}>
change to a non-existent activeKey
</button>
</div>
);
}
}

ReactDOM.render(<Demo />, document.getElementById('__react-content'));
export default Demo;
1 change: 0 additions & 1 deletion examples/add.html

This file was deleted.

112 changes: 60 additions & 52 deletions examples/add.js
Original file line number Diff line number Diff line change
@@ -1,59 +1,70 @@
/* eslint react/no-multi-comp:0, no-console:0, no-alert:0, no-undef: 0 */
import 'rc-tabs/assets/index.less';
/* eslint-disable no-console,react/button-has-type,no-alert,no-plusplus */
import '../assets/index.less';
import React from 'react';
import ReactDOM from 'react-dom';
import Tabs, { TabPane } from 'rc-tabs';
import TabContent from 'rc-tabs/lib/TabContent';
import ScrollableInkTabBar from 'rc-tabs/lib/ScrollableInkTabBar';
import Tabs, { TabPane } from '../src';
import TabContent from '../src/TabContent';
import ScrollableInkTabBar from '../src/ScrollableInkTabBar';

let index = 1;

class Demo extends React.Component {
state = {
tabs: [{
title: '初始',
content: '初始内容',
}],
tabs: [
{
title: '初始',
content: '初始内容',
},
],
activeKey: '初始',
};

onTabChange = (activeKey) => {
onTabChange = activeKey => {
this.setState({
activeKey,
});
}
};

construct() {
const disabled = true;
return this.state.tabs.map((t) => {
return (<TabPane
tab={<span>{t.title}
<a
style={{
position: 'absolute',
cursor: 'pointer',
color: 'red',
right: 5,
top: 0,
}}
onClick={(e) => {
this.remove(t.title, e)
}}
>x</a>
</span>}
key={t.title}
>
<div style={{ padding: 100 }}>
{t.content}
</div>
</TabPane>);
}).concat([
<TabPane
tab={<a style={{ color: 'black', cursor: 'pointer' }} onClick={this.add}> + 添加</a>}
disabled={disabled}
key="__add"
/>,
]);
return this.state.tabs
.map(t => (
<TabPane
tab={
<span>
{t.title}
<a
style={{
position: 'absolute',
cursor: 'pointer',
color: 'red',
right: 5,
top: 0,
}}
onClick={e => {
this.remove(t.title, e);
}}
>
x
</a>
</span>
}
key={t.title}
>
<div style={{ padding: 100 }}>{t.content}</div>
</TabPane>
))
.concat([
<TabPane
tab={
<a style={{ color: 'black', cursor: 'pointer' }} onClick={this.add}>
{' '}
+ 添加
</a>
}
disabled={disabled}
key="__add"
/>,
]);
}

remove = (title, e) => {
Expand All @@ -70,7 +81,8 @@ class Demo extends React.Component {
foundIndex = i;
return false;
});
let activeKey = this.state.activeKey;

let { activeKey } = this.state;
if (activeKey === title) {
if (foundIndex) {
foundIndex--;
Expand All @@ -81,9 +93,9 @@ class Demo extends React.Component {
tabs: after,
activeKey,
});
}
};

add = (e) => {
add = e => {
e.stopPropagation();
index++;
const newTab = {
Expand All @@ -94,7 +106,7 @@ class Demo extends React.Component {
tabs: this.state.tabs.concat(newTab),
activeKey: `名称: ${index}`,
});
}
};

render() {
const tabStyle = {
Expand All @@ -107,13 +119,9 @@ class Demo extends React.Component {
<div style={tabStyle}>
<Tabs
renderTabBar={() => (
<ScrollableInkTabBar
extraContent={
<button onClick={this.add}>+添加</button>
}
/>
<ScrollableInkTabBar extraContent={<button onClick={this.add}>+添加</button>} />
)}
renderTabContent={() => <TabContent/>}
renderTabContent={() => <TabContent />}
activeKey={this.state.activeKey}
onChange={this.onTabChange}
>
Expand All @@ -125,4 +133,4 @@ class Demo extends React.Component {
}
}

ReactDOM.render(<Demo />, document.getElementById('__react-content'));
export default Demo;
1 change: 0 additions & 1 deletion examples/antd.html

This file was deleted.

Loading