瀏覽代碼

fix(inputnumber): delete by backspace after click up/down button, will call unexpected format which make input behavior weird, close #431

走鹃 3 年之前
父節點
當前提交
7e0b122eb9

+ 3 - 2
packages/semi-foundation/inputNumber/foundation.ts

@@ -126,6 +126,7 @@ class InputNumberFoundation extends BaseFoundation<InputNumberAdapter> {
         }
         this._adapter.recordCursorPosition();
         this._adapter.setFocusing(true, null);
+        this._adapter.setClickUpOrDown(false);
         this._adapter.notifyFocus(e);
     }
 
@@ -425,11 +426,11 @@ class InputNumberFoundation extends BaseFoundation<InputNumberAdapter> {
 
     /**
      * format number to string
-     * @param {number} value
+     * @param {string|number} value
      * @param {boolean} needAdjustPrec
      * @returns {string}
      */
-    doFormat(value = 0, needAdjustPrec = true): string {
+    doFormat(value: string | number = 0, needAdjustPrec = true): string {
         // if (typeof value === 'string') {
         //     return value;
         // }

+ 12 - 0
packages/semi-ui/inputNumber/_story/inputNumber.stories.js

@@ -641,3 +641,15 @@ export const FormCustomInput = () => {
 FormCustomInput.story = {
   name: 'Form.CustomInput',
 };
+
+
+export const FixPrecision = () => {
+  const [value, setValue] = useState(5.12);
+  const [value2, setValue2] = useState(5.12);
+  return (
+    <div>
+        <InputNumber onChange={v => setValue(v)} value={value} style={{ width: 190 }} precision={2} />
+        <InputNumber keepFocus onBlur={() => console.log('blur')} onChange={v => setValue2(v)} value={value2} style={{ width: 190 }} precision={2} />
+    </div>
+  );
+}

+ 5 - 1
packages/semi-ui/inputNumber/index.tsx

@@ -225,6 +225,7 @@ class InputNumber extends BaseComponent<InputNumberProps, InputNumberState> {
     currentValue!: number | string;
     cursorBefore!: string;
     cursorAfter!: string;
+    foundation: InputNumberFoundation;
     constructor(props: InputNumberProps) {
         super(props);
         this.state = {
@@ -291,7 +292,10 @@ class InputNumber extends BaseComponent<InputNumberProps, InputNumberState> {
                 if (focusing) {
                     if (this.foundation.isValidNumber(parsedNum) && parsedNum !== this.state.number) {
                         const obj: { number?: number; value?: string } = { number: parsedNum };
-                        // Updates input when a button is clicked
+                        /**
+                         * If you are clicking the button, it will automatically format once
+                         * We need to set the status to false after trigger focus event
+                         */
                         if (this.clickUpOrDown) {
                             obj.value = this.foundation.doFormat(valueStr, true);
                         }