反应图像放大减少高度和宽度

Question

如何减少高度和宽度我正在使用react-image-magnify进行缩放。我想设置固定的高度和宽度以进行正确的图像缩放控制。

<ReactImageMagnify
    {...{
      smallImage: {
        alt: "Wristwatch by Ted Baker London",
        isFluidWidth: true,
        src: data.image,
        srcSet: data.image,
        sizes: "(max-width: 480px) 100vw, (max-width: 1200px) 30vw, 360px"
      },
      largeImage: {
        isFluidWidth: true,
        src: data.image,
        width: 1200,
        height: 1800
      },
      enlargedImageContainerStyle: {
        zIndex: "1"
      }
    }}
  />

Answer 1

<ReactImageMagnify
            {...{
              smallImage: {
                className: "large",
                src: `${image}`,
                width: 380,
                height: 480,
              },
              largeImage: {
                className: "small",
                src: `${image}`,
                width: 600,
                height: 600,
              },
            }}
          />

在此React Image Magnify中，可以通过像上面的代码一样单独设置宽度和高度来自动设置大图像的高度和宽度，或者验证此链接https://www.npmjs.com/package/react-image-magnify/v /2.0.3