在一个React项目中,我已经安装了'react-responsive-carousel' npm包中的Carousel。我希望在单击其中滑动的图像时重定向到某个组件。应该如何实现?
以下是 CodeSandbox 的链接,以便更好地理解。 CodeSandbox 链接:https://codesandbox.io/s/sad-sea-1ptl3
const data = [
{
img:
"https://images.pexels.com/photos/736230/pexels-photo-736230.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500"
},
{
img:
"https://cdn.pixabay.com/photo/2015/04/19/08/32/marguerite-729510__340.jpg"
},
{
img:
"https://cdn.pixabay.com/photo/2015/04/19/08/33/flower-729512__340.jpg"
},
{
img:
"https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/sunflower-1508785046.jpg"
}
];
<Carousel autoPlay infiniteLoop showArrows={false} showThumbs={false}>
{data.map((item) => (
<Link to="/images">
<img src={item.img} />
</Link>
))}
</Carousel>
以下是 CodeSandbox 的链接,以便更好地理解。 CodeSandbox 链接:https://codesandbox.io/s/sad-sea-1ptl3