我正在使用 react-responsive-carousel 但它不能与 NextJs 中的 SSR 一起使用？您有在此组件中启用 SSR 的示例吗？

Question

我目前在做一个电商项目，有需求通过SSR拉取商品详情数据并渲染到屏幕上。虽然数据显示正确，但我在显示产品图片时遇到了问题。我正在为图片库使用 react-responsive-carousel 组件，但它无法正常运行。能否请您提供一个示例，说明如何将此组件与 SSR 一起使用？

import { Carousel } from "react-responsive-carousel";

 <Carousel
                          showArrows={true}
                          showThumbs={false}
                          className="position-relative"
                        >
                          {detaildata?.listingImages?.map((item,index) => (
                            <React.Fragment key={index}>

<Image
                                  className="d-block imgdiv" src={item} alt=""
                                  layout="fill"
                                  objectFit="cover"
                                />

                      
                            
                            </React.Fragment>
                          ))}
                        </Carousel>

我期望的输出是图像在 nextjs 中使用 SSR 正确渲染。

我的输出屏幕。