From a6ec20ba894d7152d61e8cde7bad2509332156e7 Mon Sep 17 00:00:00 2001
From: rainie <chenyutian0510@gmail.com>
Date: Thu, 17 May 2018 21:27:16 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20=20[bug]fix=20when=20scrolling?=
 =?UTF-8?q?=202=20wheels=20at=20the=20same=20it=20is=20possible=20to=20set?=
 =?UTF-8?q?=20a=20date=20outside=20min/maxDate(https://github.com/lanjingl?=
 =?UTF-8?q?ing0510/react-mobile-datepicker/issues/27)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 examples/basic/index.js |  3 ++-
 lib/DatePicker.js       | 16 ++++++++++++++++
 webpack.config.js       |  1 +
 3 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/examples/basic/index.js b/examples/basic/index.js
index a76c9a0..05c87e6 100644
--- a/examples/basic/index.js
+++ b/examples/basic/index.js
@@ -7,7 +7,7 @@ import DatePicker from '../../lib/index';
 (function main() {
     class App extends React.Component {
         state = {
-            time: new Date(2016, 8, 16, 8, 20, 57),
+            time: new Date(),
             isOpen: false,
             theme: 'default',
         }
@@ -75,6 +75,7 @@ import DatePicker from '../../lib/index';
                     <DatePicker
                         value={this.state.time}
                         dateSteps={[1, 1, 5]}
+                        max={new Date()}
                         dateFormat={['YYYY', ['MM', (month) => monthMap[month]], 'DD']}
                         theme={this.state.theme}
                         isOpen={this.state.isOpen}
diff --git a/lib/DatePicker.js b/lib/DatePicker.js
index 6e8ee28..ade5d8a 100644
--- a/lib/DatePicker.js
+++ b/lib/DatePicker.js
@@ -50,6 +50,22 @@ class DatePicker extends Component<void, Props, State> {
         }
     }
 
+    /**
+     * When you swipe two datepickeritems at the same time.
+     * Prevent dates from going out.
+     */
+    componentDidUpdate() {
+        const value = this.state.value;
+        const { min, max } = this.props;
+        if (value.getTime() > max.getTime()) {
+            this.setState({ value: max });
+        }
+
+        if (value.getTime() < min.getTime()) {
+            this.setState({ value: min });
+        }
+    }
+        
     /**
      * Optimization component, Prevents unnecessary rendering
      * Only props or state change or value before re-rendering
diff --git a/webpack.config.js b/webpack.config.js
index 7eabfa1..0f9ffcf 100755
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -21,6 +21,7 @@ module.exports = {
     devtool: 'eval-source-map',
     devServer: {
         historyApiFallback: true,
+        disableHostCheck: true,
         hot: true,
         inline: true,
         host: '0.0.0.0',