[BUG] 被ImagePreview组件包裹的Image组件与单独的Image组件 在preview属性未设置时行为不一致问题

[WUTONK]

Is there an existing issue for this?

• I have searched the existing issues

Which Component

ImagePreview

Semi Version

2.86.0

Current Behavior

问题描述

被ImagePreview组件包裹的Image 组件与单独的Image 组件 在不设置 preview 属性时出现的行为不一致（在被ImagePreview组件包裹的Image组件没有手动设置preview={true}时，可以点击开预览页面，但是大图一直加载不出）
且在官网用例中没有这个问题

官网示例代码

https://semi.design/zh-CN/show/image#%E5%A4%9A%E5%9B%BE%E9%A2%84%E8%A7%88

当前情况下解决方案

需要明确设置 preview={true} 才能正常工作

Expected Behavior

期望行为

• Image 组件的 preview 属性默认为 true， 被ImagePreview包裹时应也是这样，无需额外设置 preview={true}

Steps To Reproduce

复现步骤

1. 在 ImagePreview 组件中放置 Image 组件
2. 不设置 Image 的 preview 属性（默认为 true）
3. 点击在ImagePreview中的图片会打开预览界面，但大图一直处于加载状态

ReproducibleCode

import React, { useMemo } from 'react';
import { Image, ImagePreview } from '@douyinfe/semi-ui';
import reactLogo from './assets/react.svg';
import viteLogo from '/vite.svg';

function ImgPreview(): React.JSX.Element {
  const srcList = useMemo(() => ([
    reactLogo,
    viteLogo,
    "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjE1MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSIjZmY2NjY2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSJBcmlhbCIgZm9udC1zaXplPSIxOCIgZmlsbD0id2hpdGUiIHRleHQtYW5jaG9yPSJtaWRkbGUiIGR5PSIuM2VtIj7kuI3og73ml6Dms5Xlj5HnjrDvvIzlvZPliY3nva7vvI88L3RleHQ+PC9zdmc+",
    "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjE1MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSIjNjZmZmZmIi8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSJBcmlhbCIgZm9udC1zaXplPSIxOCIgZmlsbD0id2hpdGUiIHRleHQtYW5jaG9yPSJtaWRkbGUiIGR5PSIuM2VtIj7kuI3og73ml6Dms5Xlj5HnjrDvvIzlvZPliY3nva7vvI88L3RleHQ+PC9zdmc+",
  ]), []);

  return (
    <div style={{ padding: '20px', width: '100%', height: '100%' }}>
      <h2>Semi Design ImagePreview 测试</h2>
      <p>点击任意图片可以打开预览模式：</p>
      <div style={{ display: 'flex', gap: '10px', flexWrap: 'wrap' }}>
        <ImagePreview>
          {srcList.map((src, index) => {
            return (
              <Image
                key={index}
                src={src}
                width={200}
                height={150}
                alt={`测试图片${index + 1}`}
                style={{ marginRight: 5, marginBottom: 10, border: '1px solid #ccc' }}
                // preview={true}
              />
            );
          })}
        </ImagePreview>
      </div>

      <div style={{ padding: '20px', width: '50%', height: '50%' }}>
        <Image
            width={100}
            height={100}
            src={reactLogo}
            // preview={true}
          />
      </div>

    </div>
  );
}

export default ImgPreview

Environment

## 环境信息
- 操作系统: macOS Darwin 24.6.0 (ARM64)
- Node.js: v22.17.0
- pnpm: 10.12.4
- Vite: 7.1.5
- @douyinfe/semi-ui: 2.86.0
- @douyinfe/semi-icons: 2.86.0
- React: 19.1.1

Anything else?

2025-09-14.00-17-16.mov