我在将 React Bootstrap 的轮播设置为不自动播放时遇到问题。
这是我现在的代码:
import React from 'react';
import Carousel from 'react-bootstrap/Carousel';
import pigment1 from '../images/design-images/pigment/page1.jpeg';
import pigment2 from '../images/design-images/pigment/page2.jpg';
import pigment3 from '../images/design-images/pigment/page3.jpg';
import './DesignProjects.css';
function DesignProjects(props) {
return (
<section>
<h2>Design Work</h2>
<div className='design-project'>
<h3>Pigment Website Redesign</h3>
<Carousel interval={false}>
<Carousel.Item>
<img className='d-block w-100' src={pigment1} alt='First slide' />
</Carousel.Item>
<Carousel.Item>
<img className='d-block w-100' src={pigment2} alt='Third slide' />
</Carousel.Item>
<Carousel.Item>
<img className='d-block w-100' src={pigment3} alt='Third slide' />
</Carousel.Item>
</Carousel>
</div>
</section>
);
}
export default DesignProjects;
Run Code Online (Sandbox Code Playgroud)
根据我读到的内容,我需要将间隔设置为 false...但我尝试这样做的每一种方法都会导致出现错误或轮播在图像中更快地循环。上面是我尝试的最后一种方法,但它再次不起作用,而是循环得更快。 …