fix(steps): inconsistent rendering between string and number when the props of 'current' is a string (#761)

- Character conversion when the props of 'current' is a string

Author: ImaginingMaker

src/steps/StepItem.tsx

@@ -60,7 +60,7 @@ const StepItem: FC<StepItemProps> = (props) => {
   const dot = useMemo(() => theme === StepThemeEnum.DOT, [theme]);
   const currentStatus = useMemo(() => {
     if (status !== 'default') return status;
-    if (index === current) return stepsStatus;
+    if (index === +current) return stepsStatus;
     if (index < +current) return 'finish';
     return status;
   }, [index, current, stepsStatus, status]);

src/steps/_example/horizontal.tsx

@@ -3,7 +3,7 @@ import { Steps, StepItem } from 'tdesign-mobile-react';
 import { CartIcon } from 'tdesign-icons-react';
 
 export default function StepsDemo() {
-  const [first, setFirst] = useState(1);
+  const [first, setFirst] = useState<number | string>('1');
   const [second, setSecond] = useState(1);
   const [third, setThird] = useState(1);
   const options = {
@@ -13,7 +13,7 @@ export default function StepsDemo() {
   };
 
   const count = 4;
-  const onFirstChange = (current: number) => {
+  const onFirstChange = (current: number | string) => {
     setFirst(current);
   };
   const onSecondChange = (current: number) => {
@@ -23,14 +23,17 @@ export default function StepsDemo() {
     setThird(current);
   };
 
-  const getTitle = (type: 'first' | 'second' | 'third', index: number) => {
-    if (index === options[type]) {
+  const getTitle = (type: 'first' | 'second' | 'third', index: number | string) => {
+    const numIndex = Number(index);
+    const currentValue = Number(options[type]);
+
+    if (numIndex === currentValue) {
       return '当前步骤';
     }
-    if (index < options[type]) {
+    if (numIndex < currentValue) {
       return '已完成';
     }
-    if (index > options[type]) {
+    if (numIndex > currentValue) {
       return '未完成';
     }
   };