change onSelect API to onAction, resolves #39

Affected components: - Modal - NavBar - Slider - Tabs - TabBar
amazeui · Apr 25, 2016 · 93fac1f · 93fac1f
1 parent 89bc1ff
commit 93fac1f
Show file tree

Hide file tree

Showing 14 changed files with 37 additions and 35 deletions.
diff --git a/docs/modal/api.md b/docs/modal/api.md
@@ -47,7 +47,7 @@ Modal 标题。
 
 点击遮罩层是否关闭 Modal。
 
-##### `onSelect`
+##### `onAction`
 
 > PropType: `func`
 

diff --git a/docs/navbar/api.md b/docs/navbar/api.md
@@ -47,7 +47,7 @@ const leftNav = [
 
 主标题是否居左，默认居中。
 
-##### `onSelect`
+##### `onAction`
 
 > PropType: `func`
 

diff --git a/docs/slider/api.md b/docs/slider/api.md
@@ -46,7 +46,7 @@
 
 默认激活的幻灯片编号。
 
-##### `onSelect`
+##### `onAction`
 
 > PropType: `func`
 

diff --git a/docs/tabbar/api.md b/docs/tabbar/api.md
@@ -30,7 +30,7 @@
 - `'alert'`
 - `'dark'`
 
-##### `onSelect`
+##### `onAction`
 
 > PropType: `func`
 

diff --git a/docs/tabs/api.md b/docs/tabs/api.md
@@ -16,7 +16,7 @@
 
 激活选项卡的 `eventKey`。
 
-##### `onSelect`
+##### `onAction`
 
 > PropType: `func`
 

diff --git a/kitchen-sink/pages/ModalExample.js b/kitchen-sink/pages/ModalExample.js
@@ -17,7 +17,7 @@ const ModalExample = React.createClass({
     this.refs.modal.close();
   },
 
-  handleSelect(data) {
+  handleAction(data) {
     let role = this.refs.modal.props.role;
 
     // 确定和取消放在一起处理
@@ -41,7 +41,7 @@ const ModalExample = React.createClass({
 
         {React.cloneElement(React.Children.only(this.props.children), {
           ref: 'modal',
-          onSelect: this.handleSelect
+          onAction: this.handleAction
         })}
       </div>
     );

diff --git a/kitchen-sink/pages/NavBarExample.js b/kitchen-sink/pages/NavBarExample.js
@@ -25,19 +25,19 @@ const dataAll = {
   title: 'Navbar',
   leftNav: [{...itemLeft, icon: 'left-nav'}],
   rightNav: [{...itemRight, icon: 'right-nav'}],
-  onSelect: clickHandler,
+  onAction: clickHandler,
 };
 
 const dataLeft = {
   title: 'Navbar',
   leftNav: [{...itemLeft, icon: 'left-nav'}],
-  onSelect: clickHandler,
+  onAction: clickHandler,
 };
 
 const dataRight = {
   title: 'Navbar',
   rightNav: [itemRight, itemRight],
-  onSelect: clickHandler,
+  onAction: clickHandler,
 };
 
 const NavBarExample = React.createClass({

diff --git a/kitchen-sink/pages/TabBarExample.js b/kitchen-sink/pages/TabBarExample.js
@@ -29,7 +29,7 @@ const TabBarDemo = React.createClass({
     return (
       <TabBar
         amStyle="primary"
-        onSelect={this.handleClick}
+        onAction={this.handleClick}
       >
         <TabBar.Item
           eventKey="home"

diff --git a/src/js/Accordion.js b/src/js/Accordion.js
@@ -12,7 +12,7 @@ const Accordion = React.createClass({
     activeKey: React.PropTypes.any,
     defaultActiveKey: React.PropTypes.any,
     inset: React.PropTypes.bool,
-    onSelect: React.PropTypes.func,
+    onAction: React.PropTypes.func,
   },
 
   getDefaultProps() {
@@ -28,16 +28,16 @@ const Accordion = React.createClass({
   },
 
   shouldComponentUpdate: function() {
-    // Defer any updates to this component during the `onSelect` handler.
+    // Defer any updates to this component during the `onAction` handler.
     return !this._isChanging;
   },
 
   handleSelect(e, key) {
     e.preventDefault();
 
-    if (this.props.onSelect) {
+    if (this.props.onAction) {
       this._isChanging = true;
-      this.props.onSelect(key);
+      this.props.onAction(key);
       this._isChanging = false;
     }
 
@@ -60,7 +60,7 @@ const Accordion = React.createClass({
       } = child.props;
       let props = {
         key: index,
-        onSelect: this.handleSelect,
+        onAction: this.handleSelect,
       };
 
       if (eventKey === undefined) {
@@ -98,10 +98,12 @@ Accordion.Item = React.createClass({
   },
 
   handleClick: function(e) {
+    // @see https://facebook.github.io/react/docs/events.html#event-pooling
+    e.persist();
     e.selected = true;
 
-    if (this.props.onSelect) {
-      this.props.onSelect(e, this.props.eventKey);
+    if (this.props.onAction) {
+      this.props.onAction(e, this.props.eventKey);
     } else {
       e.preventDefault();
     }

diff --git a/src/js/Modal.js b/src/js/Modal.js
@@ -29,7 +29,7 @@ const Modal = React.createClass({
     cancelText: React.PropTypes.string,
     closeBtn: React.PropTypes.bool,
     closeViaBackdrop: React.PropTypes.bool,
-    onSelect: React.PropTypes.func,
+    onAction: React.PropTypes.func,
     onOpen: React.PropTypes.func,
     onClosed: React.PropTypes.func,
   },
@@ -40,7 +40,7 @@ const Modal = React.createClass({
       confirmText: '确定',
       cancelText: '取消',
       closeBtn: true,
-      onSelect: () => {
+      onAction: () => {
       },
       onOpen: () => {
       },
@@ -97,7 +97,7 @@ const Modal = React.createClass({
     }
 
     this.close();
-    this.props.onSelect.call(this, data, e);
+    this.props.onAction.call(this, data, e);
   },
 
   open() {

diff --git a/src/js/NavBar.js b/src/js/NavBar.js
@@ -12,13 +12,13 @@ const NavBar = React.createClass({
     leftNav: React.PropTypes.array,
     rightNav: React.PropTypes.array,
     titleOnLeft: React.PropTypes.bool,
-    onSelect: React.PropTypes.func,
+    onAction: React.PropTypes.func,
   },
 
   getDefaultProps() {
     return {
       classPrefix: 'navbar',
-      onSelect: () => {
+      onAction: () => {
       },
     };
   },
@@ -83,7 +83,7 @@ const NavBar = React.createClass({
       <Component
         href={item.href}
         key={'navbarNavItem' + index}
-        onClick={this.props.onSelect.bind(this, item)}
+        onClick={this.props.onAction.bind(this, item)}
         {...itemProps}
         className={classNames(this.prefixClass('nav-item'), itemProps.className)}
       >

diff --git a/src/js/Slider.js b/src/js/Slider.js
@@ -27,7 +27,7 @@ const Slider = React.createClass({
     pauseOnHover: React.PropTypes.bool,
     // touch: React.PropTypes.bool,
 
-    onSelect: React.PropTypes.func,
+    onAction: React.PropTypes.func,
     onSlideEnd: React.PropTypes.func,
     activeIndex: React.PropTypes.number,
     defaultActiveIndex: React.PropTypes.number,
@@ -186,8 +186,8 @@ const Slider = React.createClass({
 
     direction = direction || this.getDirection(previousActiveIndex, index);
 
-    if (this.props.onSelect) {
-      this.props.onSelect(index, direction);
+    if (this.props.onAction) {
+      this.props.onAction(index, direction);
     }
 
     if (this.props.activeIndex == null && index !== previousActiveIndex) {

diff --git a/src/js/TabBar.js b/src/js/TabBar.js
@@ -12,14 +12,14 @@ let TabBar = React.createClass({
     classPrefix: React.PropTypes.string,
     component: React.PropTypes.node,
     amStyle: React.PropTypes.string,
-    onSelect: React.PropTypes.func,
+    onAction: React.PropTypes.func,
   },
 
   getDefaultProps() {
     return {
       classPrefix: 'tabbar',
       component: 'nav',
-      onSelect: function() {}
+      onAction: function() {}
     };
   },
 
@@ -29,7 +29,7 @@ let TabBar = React.createClass({
       component: Component,
       className,
       children,
-      onSelect,
+      onAction,
       ...props
       } = this.props;
 
@@ -44,7 +44,7 @@ let TabBar = React.createClass({
             onClick,
             ...props
             } = child.props;
-          let clickHandler = onClick || onSelect;
+          let clickHandler = onClick || onAction;
           let key = eventKey || index;
           eventKey = eventKey || key;
 
@@ -89,7 +89,7 @@ TabBar.Item = React.createClass({
     return {
       classPrefix: 'tabbar',
       component: 'span',
-      onSelect: function() {
+      onAction: function() {
       }
     };
   },

diff --git a/src/js/Tabs.js b/src/js/Tabs.js
@@ -10,7 +10,7 @@ const Tabs = React.createClass({
   propTypes: {
     classPrefix: React.PropTypes.string,
     defaultActiveKey: React.PropTypes.any,
-    onSelect: React.PropTypes.func,
+    onAction: React.PropTypes.func,
   },
 
   getDefaultProps() {
@@ -59,8 +59,8 @@ const Tabs = React.createClass({
       return null;
     }
 
-    if (this.props.onSelect) {
-      this.props.onSelect(key);
+    if (this.props.onAction) {
+      this.props.onAction(key);
     }
 
     if (activeKey !== key) {