@@ -113,22 +129,24 @@ class TabGroup extends PureComponent {
}
}
-TabGroup.propTypes = {
+Tab.propTypes = {
prefixCls: PropTypes.string,
className: PropTypes.string,
theme: PropTypes.oneOf(['default', 'primary', 'info', 'success', 'warning', 'error']),
lineWidth: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
disabled: PropTypes.bool,
+ canSwipe: PropTypes.bool,
onChange: PropTypes.func,
};
-TabGroup.defaultProps = {
+Tab.defaultProps = {
prefixCls: 'za-tab',
className: null,
theme: 'primary',
lineWidth: null,
disabled: false,
+ canSwipe: false,
onChange() {},
};
-export default TabGroup;
+export default Tab;
diff --git a/components/Tab/TabContainer.jsx b/components/Tab/TabPanel.jsx
similarity index 86%
rename from components/Tab/TabContainer.jsx
rename to components/Tab/TabPanel.jsx
index a977b7cd8..0f38c773b 100644
--- a/components/Tab/TabContainer.jsx
+++ b/components/Tab/TabPanel.jsx
@@ -2,7 +2,7 @@ import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
-class TabContainer extends PureComponent {
+class TabPanel extends PureComponent {
constructor(props) {
super(props);
this.state = {
@@ -35,14 +35,14 @@ class TabContainer extends PureComponent {
}
}
-TabContainer.propTypes = {
+TabPanel.propTypes = {
prefixCls: PropTypes.string,
className: PropTypes.string,
};
-TabContainer.defaultProps = {
+TabPanel.defaultProps = {
prefixCls: 'za-tab-container-item',
className: null,
};
-export default TabContainer;
+export default TabPanel;
\ No newline at end of file
diff --git a/components/Tab/index.js b/components/Tab/index.js
index 4b6d01954..67b490cb4 100644
--- a/components/Tab/index.js
+++ b/components/Tab/index.js
@@ -1,6 +1,6 @@
import Tab from './Tab';
-import TabItem from './TabContainer';
+import TabPanel from './TabPanel';
-Tab.Item = TabItem;
+Tab.Panel = TabPanel;
export default Tab;
diff --git a/examples/pages/SwipePage.jsx b/examples/pages/SwipePage.jsx
index 7c02dd76d..8e1295e9f 100644
--- a/examples/pages/SwipePage.jsx
+++ b/examples/pages/SwipePage.jsx
@@ -6,29 +6,16 @@ import { Panel, Swipe, Button } from '../../components';
import '../styles/pages/SwipePage';
const ITEMS = [
- {
- url: '#',
- img: require('../images/banners/1.png'),
- },
- {
- url: '#',
- img: require('../images/banners/2.png'),
- },
- {
- url: '#',
- img: require('../images/banners/3.png'),
- },
+ require('../images/banners/1.png'),
+ require('../images/banners/2.png'),
+ require('../images/banners/3.png'),
];
function contentRender() {
return ITEMS.map((item, i) => {
return (
-
-
+
+
);
});
diff --git a/examples/pages/TabPage.jsx b/examples/pages/TabPage.jsx
index 9895276e9..7b42b0ed8 100644
--- a/examples/pages/TabPage.jsx
+++ b/examples/pages/TabPage.jsx
@@ -15,7 +15,7 @@ class TabPage extends Component {
}
render() {
- const { Item } = Tab;
+ const TabPanel = Tab.Panel;
return (
@@ -27,12 +27,28 @@ class TabPage extends Component {
{ console.log(i); }}>
- -
+
选项卡1内容
-
- -
+
+
选项卡2内容
-
+
+
+
+
+
+
+
+ 可滑动
+
+
+ { console.log(i); }}>
+
+ 试试点我左滑
+
+
+ 试试点我右滑
+
@@ -43,24 +59,24 @@ class TabPage extends Component {
-
-
-
+
+
+
-
-
-
+
+
+
-
-
-
+
+
+
-
-
-
+
+
+
@@ -77,21 +93,21 @@ class TabPage extends Component {
activeIndex: i,
});
}}>
-
-
-
+
+
+
console.log(i)}>
- -
+
选项卡1内容
-
- -
+
+
选项卡2内容
-
- -
+
+
选项卡3内容
-
+
@@ -102,15 +118,15 @@ class TabPage extends Component {
- -
+
选项卡1内容
-
- -
+
+
选项卡2内容
-
- -
+
+
选项卡3内容
-
+
@@ -121,15 +137,15 @@ class TabPage extends Component {
- -
+
选项卡1内容
-
- -
+
+
选项卡2内容
-
- -
+
+
选项卡3内容
-
+
@@ -140,15 +156,15 @@ class TabPage extends Component {
- -
+
选项卡1内容
-
- -
+
+
选项卡2内容
-
- -
+
+
选项卡3内容
-
+
diff --git a/styles/components/Swipe.scss b/styles/components/Swipe.scss
index 3f5b22942..9dcf10c07 100644
--- a/styles/components/Swipe.scss
+++ b/styles/components/Swipe.scss
@@ -3,11 +3,13 @@ $prefixCls: za-swipe;
.#{$prefixCls} {
position: relative;
overflow: hidden;
+ font-size: 0;
&-item {
display: inline-block;
width: 100%;
height: 100%;
+ font-size: r(16);
}
&-pagination {