🐛 [bug]fix scrolling up will refresh page.

Author: lanjingling0510

lib/DatePickerItem.js

@@ -41,6 +41,13 @@ class DatePickerItem extends Component {
         this._iniDates(this.props.value);
     }
 
+    componentDidMount() {
+        const viewport = this.viewport;
+        viewport.addEventListener('touchstart', this.handleContentTouch, false);
+        viewport.addEventListener('touchmove', this.handleContentTouch, false);
+        viewport.addEventListener('touchend', this.handleContentTouch, false);
+        viewport.addEventListener('mousedown', this.handleContentMouseDown, false);
+    }
 
     componentWillReceiveProps(nextProps) {
         if (nextProps.value.getTime() === this.props.value.getTime()) {
@@ -67,6 +74,14 @@ class DatePickerItem extends Component {
             !shallowEqual(nextState, this.state);
     }
 
+    componentWillUnmount() {
+        const viewport = this.viewport;
+        viewport.removeEventListener('touchstart', this.handleContentTouch, false);
+        viewport.removeEventListener('touchmove', this.handleContentTouch, false);
+        viewport.removeEventListener('touchend', this.handleContentTouch, false);
+        viewport.removeEventListener('mousedown', this.handleContentMouseDown, false);
+    }
+
     _iniDates(date) {
         const { typeName } = this.props;
         const dates = Array(...Array(DATE_LENGTH))
@@ -258,11 +273,8 @@ class DatePickerItem extends Component {
         return (
             <div className="datepicker-col-1">
                 <div
-                    className="datepicker-viewport"
-                    onTouchStart={this.handleContentTouch}
-                    onTouchMove={this.handleContentTouch}
-                    onTouchEnd={this.handleContentTouch}
-                    onMouseDown={this.handleContentMouseDown}>
+                    ref={viewport => this.viewport = viewport} // eslint-disable-line
+                    className="datepicker-viewport">
                     <div className="datepicker-wheel">
                         <ul
                             ref="scroll"

lib/index.css

@@ -106,7 +106,6 @@
         width: 100%;
     }
 
-
     .datepicker-scroll {
         list-style-type: none;
         &>li {

package.json

@@ -83,4 +83,4 @@
     "webpack-dev-server": "^1.14.1"
   },
   "license": "ISC"
-}
+}