fix: fix error type define for defaultCurrentIndex in ImagePreview (#1751)

cypress/e2e/image.spec.js

@@ -524,4 +524,13 @@ describe('image', () => {
         // 进入预览状态
         cy.get('.semi-image-img').eq(0).should('have.attr', 'src', 'https://lf3-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/root-web-sites/lion.jpeg');
     });
+
+    // defaultCurrentIndex
+    it('defaultCurrentIndex', () => {
+        cy.visit('http://127.0.0.1:6006/iframe.html?id=image--default-current-index&args=&viewMode=storyi');
+        cy.get('.semi-button').eq(0).click();
+        // 等待 2000 ms， 确保当前src 已经完全改变上
+        cy.wait(2000);
+        cy.get('.semi-image-preview-image-img').eq(0).should('have.attr', 'src', 'https://lf3-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/root-web-sites/seaside.jpeg');
+    });
 });

packages/semi-ui/image/_story/image.stories.jsx

@@ -213,6 +213,42 @@ export const ControlledPreviewMultiple = () => {
     )
 }
 
+export const DefaultCurrentIndex = () => {
+    const [visible, setVisible] = useState(false);
+    const [index, setIndex] = useState(1);
+
+    const handlePreviewVisibleChange = useCallback((v) => {
+        setVisible(v);
+    }, []);
+
+    const handleClick = useCallback(() => {
+        setVisible(!visible);
+    }, [visible])
+
+    const onInputChange = useCallback((value) => {
+        setIndex(Number(value) ?? 0);
+    }
+    ,[])
+
+    const imageData = srcList1;
+
+    return (
+        <>
+            <span>{`输入默认打开图片index(0-${imageData.length - 1})`}</span>
+            <Input style={{ width: 100 }} defaultValue={index} onChange={onInputChange}/>
+            <br /><br />
+            <Button onClick={handleClick}>{visible ? "hide" : "show multiple"}</Button>
+            <ImagePreview 
+                key={index}
+                src={imageData}
+                visible={visible}
+                defaultCurrentIndex={index}
+                onVisibleChange={handlePreviewVisibleChange}
+            />
+        </>
+    );
+}
+
 export const BasicPreview = () => {
     const [showTooltip, setShowTooltip] = useState(false);
     const [customTooltip, setCustomTooltip] = useState(false);
@@ -653,4 +689,5 @@ export const SetDownloadName = () => {
             })}
         </ImagePreview>
     </>);
-}
+}
+

packages/semi-ui/image/interface.tsx

@@ -32,7 +32,7 @@ export interface PreviewProps extends BaseProps {
     src?: string | string[];
     previewTitle?: ReactNode;
     currentIndex?: number;
-    defaultIndex?: number;
+    defaultCurrentIndex?: number;
     defaultVisible?: boolean;
     maskClosable?: boolean;
     closable?: boolean;

packages/semi-ui/image/preview.tsx

@@ -20,7 +20,7 @@ export default class Preview extends BaseComponent<PreviewProps, PreviewState> {
         visible: PropTypes.bool,
         src: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
         currentIndex: PropTypes.number,
-        defaultIndex: PropTypes.number,
+        defaultCurrentIndex: PropTypes.number,
         defaultVisible: PropTypes.bool,
         maskClosable: PropTypes.bool,
         closable: PropTypes.bool,

packages/semi-ui/image/previewInner.tsx

@@ -31,7 +31,7 @@ export default class PreviewInner extends BaseComponent<PreviewInnerProps, Previ
         visible: PropTypes.bool,
         src: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
         currentIndex: PropTypes.number,
-        defaultIndex: PropTypes.number,
+        defaultCurrentIndex: PropTypes.number,
         defaultVisible: PropTypes.bool,
         maskClosable: PropTypes.bool,
         closable: PropTypes.bool,