fix(Slider): Fixed the issue where entering a minus sign triggered an…

… onChange event with NaN.
xulingling0 · Apr 26, 2024 · e29b485 · e29b485
1 parent 4740d8c
commit e29b485
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 7 deletions.
diff --git a/components/Slider/input.tsx b/components/Slider/input.tsx
@@ -49,8 +49,11 @@ const Input = function (props: InputProps) {
           value={innerValue[0]}
           key={0}
           onChange={(val, reason) => {
-            handleChange([val, innerValue[1]]);
-            beginExtraProps?.onChange && beginExtraProps?.onChange(val, reason);
+            // eslint-disable-next-line no-self-compare
+            if (!(isNaN(val) && val !== val)) {
+              handleChange([val, innerValue[1]]);
+              beginExtraProps?.onChange && beginExtraProps?.onChange(val, reason);
+            }
           }}
         />,
         <div key={1} className={`${prefixCls}-input-range`}>
@@ -62,8 +65,11 @@ const Input = function (props: InputProps) {
         key={2}
         value={innerValue[1]}
         onChange={(val, reason) => {
-          handleChange([innerValue[0], val]);
-          endExtraProps?.onChange && endExtraProps?.onChange(val, reason);
+          // eslint-disable-next-line no-self-compare
+          if (!(isNaN(val) && val !== val)) {
+            handleChange([innerValue[0], val]);
+            endExtraProps?.onChange && endExtraProps?.onChange(val, reason);
+          }
         }}
       />
     </div>

diff --git a/components/Tabs/tab-header/tab-ink.tsx b/components/Tabs/tab-header/tab-ink.tsx
@@ -48,9 +48,11 @@ const TabInk = ({
 
       if (newStyle && !isEqualWith(inkStyleRef.current, newStyle)) {
         inkStyleRef.current = newStyle;
-        Object.keys(newStyle).forEach((key) => {
-          inkRef.current.style[key] = newStyle[key];
-        });
+        if (inkRef.current) {
+          Object.keys(newStyle).forEach((key) => {
+            inkRef.current.style[key] = newStyle[key];
+          });
+        }
       }
     });
 

diff --git a/stories/Slider.story.tsx b/stories/Slider.story.tsx
@@ -67,6 +67,23 @@ function DemoSlider() {
 
 export const Demo = () => <DemoSlider />;
 
+export function Input() {
+  return (
+    <>
+      <Slider
+        defaultValue={80}
+        showInput
+        step={0.1}
+        min={-10}
+        style={{ width: 280 }}
+        onChange={(v) => {
+          console.log(v);
+        }}
+      />
+    </>
+  );
+}
+
 export default {
   title: 'Slider',
 };