diff --git a/src/InputNumber.tsx b/src/InputNumber.tsx index 3862989c..a71139eb 100644 --- a/src/InputNumber.tsx +++ b/src/InputNumber.tsx @@ -293,7 +293,7 @@ class InputNumber extends React.Component, InputNumber if (onBlur) { const originValue = this.input.value; const displayValue = this.getInputDisplayValue({ focus: false, value: newValue }); - this.input.value = displayValue ? Number(displayValue) : displayValue; + this.input.value = displayValue; onBlur(...args); this.input.value = originValue; } diff --git a/tests/index.test.js b/tests/index.test.js index 3232df4f..d73d625c 100644 --- a/tests/index.test.js +++ b/tests/index.test.js @@ -1,3 +1,4 @@ +/* eslint-disable max-classes-per-file */ /* eslint-disable react/no-multi-comp, no-unused-vars, react/no-unused-state */ import React from 'react'; import keyCode from 'rc-util/lib/KeyCode'; @@ -1327,6 +1328,37 @@ describe('InputNumber', () => { expect(targetValue).to.be(''); }); + it('should set input value as formatted when blur', () => { + let valueOnBlur; + function onBlur(e) { + valueOnBlur = e.target.value; + } + class Demo extends React.Component { + state = { + value: 1, + }; + + render() { + return ( +
+ `${value * 100}%`} + value={this.state.value} + /> +
+ ); + } + } + example = ReactDOM.render(, container); + inputNumber = example.refs.inputNum; + inputElement = ReactDOM.findDOMNode(inputNumber.input); + Simulate.blur(inputElement); + expect(inputElement.value).to.be('100%'); + expect(valueOnBlur).to.be('100%'); + }); + // https://github.com/ant-design/ant-design/issues/11574 it('should trigger onChange when max or min change', () => { const onChange = sinon.spy();