fix(NumberPicker): value set to min while next value < min by click +

alibaba-fusion · Jan 22, 2019 · 6863b9f · 6863b9f
1 parent a420197
commit 6863b9f
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 13 deletions.
diff --git a/src/number-picker/index.jsx b/src/number-picker/index.jsx
@@ -5,7 +5,7 @@ import Icon from '../icon';
 import Button from '../button';
 import Input from '../input';
 import ConfigProvider from '../config-provider';
-import {func, obj} from '../util';
+import { func, obj } from '../util';
 
 /** NumberPicker */
 class NumberPicker extends React.Component {
@@ -259,7 +259,7 @@ class NumberPicker extends React.Component {
             });
         }
 
-        this.props.onChange(isNaN(v) || v === '' ? undefined : v, {...e, triggerType});
+        this.props.onChange(isNaN(v) || v === '' ? undefined : v, { ...e, triggerType });
     }
 
     setInputValue(v, e) {
@@ -299,7 +299,7 @@ class NumberPicker extends React.Component {
     }
 
     upStep(val) {
-        const {step, min} = this.props;
+        const { step, min } = this.props;
         const precisionFactor = this.getPrecisionFactor();
         let result;
         if (typeof val === 'number') {
@@ -313,7 +313,7 @@ class NumberPicker extends React.Component {
     }
 
     downStep(val) {
-        const {step, min} = this.props;
+        const { step, min } = this.props;
         const precisionFactor = this.getPrecisionFactor();
         let result;
         if (typeof val === 'number') {
@@ -344,17 +344,23 @@ class NumberPicker extends React.Component {
         if (e) {
             e.preventDefault();
         }
-        const {disabled, min, max} = this.props;
+
+        const { disabled, min, max } = this.props;
         if (disabled) {
             return;
         }
+
         const value = this.state.value;
         if (isNaN(value)) {
             return;
         }
-        const val = this[`${type}Step`](value);
-        if (val > max || val < min) {
-            return;
+
+        let val = this[`${type}Step`](value);
+        if (val > max) {
+            val = max;
+        }
+        if (val < min) {
+            val = min;
         }
         this.setValue(val, e, type);
     }
@@ -382,7 +388,7 @@ class NumberPicker extends React.Component {
     }
 
     render() {
-        const {type, prefix, disabled, style, className, size, max, min, autoFocus, editable, state} = this.props;
+        const { type, prefix, disabled, style, className, size, max, min, autoFocus, editable, state } = this.props;
 
         const prefixCls = `${prefix}number-picker`;
 
@@ -410,22 +416,22 @@ class NumberPicker extends React.Component {
         if (type === 'normal') {
             innerAfter = ([
                 <Button disabled={disabled || upDisabled} onClick={this.up.bind(this)} key="0">
-                    <Icon size="xxs" type="arrow-up"/>
+                    <Icon size="xxs" type="arrow-up" />
                 </Button>,
                 <Button disabled={disabled || downDisabled} onClick={this.down.bind(this)} key="1">
-                    <Icon size="xxs" type="arrow-down"/>
+                    <Icon size="xxs" type="arrow-down" />
                 </Button>
             ]);
             innerAfterClassName = `${prefixCls}-handler`;
         } else {
             addonBefore = (
                 <Button size={size} disabled={disabled || downDisabled} onClick={this.down.bind(this)}>
-                    <Icon type="minus" size="xs"/>
+                    <Icon type="minus" size="xs" />
                 </Button>
             );
             addonAfter = (
                 <Button size={size} disabled={disabled || upDisabled} onClick={this.up.bind(this)}>
-                    <Icon type="add" size="xs"/>
+                    <Icon type="add" size="xs" />
                 </Button>
             );
         }

diff --git a/test/number-picker/index-spec.js b/test/number-picker/index-spec.js
@@ -200,6 +200,24 @@ describe('number-picker', () => {
             done();
         });
 
+        it('should be equal min while next value < min by click +', (done) => {
+            let onChange = (value) => {
+                assert(value === 30);
+                done();
+            }, wrapper = mount(<NumberPicker defaultValue={5} min={30} step={3} onChange={onChange}/>);
+
+            wrapper.find('button').at(0).simulate('click');
+        });
+
+        it('should be equal max while next value > max by click -', (done) => {
+            let onChange = (value) => {
+                assert(value === 30);
+                done();
+            }, wrapper = mount(<NumberPicker defaultValue={205} max={30} step={3} onChange={onChange}/>);
+
+            wrapper.find('button').at(1).simulate('click');
+        });
+
         it('should support precision', (done) => {
             let wrapper = mount(<NumberPicker defaultValue={0.121}  step={0.01} precision={3} />);