我遵循了文档https://www.npmjs.com/package/react-owl-carousel2,并尝试集成猫头鹰轮播2。它是图像轮播。即使更改了项目选项值,所有图像也都显示为一侧。下面是我的代码。任何人都可以看看为什么它不起作用。
import React from 'react';
import OwlCarousel from 'react-owl-carousel2';
import 'owl.carousel/dist/assets/owl.carousel.css';
import 'owl.carousel/dist/assets/owl.theme.default.css';
export default class CalendarView extends React.Component{
render(){
const options = {
items: 1,nav: true,rewind: true,autoplay: true
};
return(
<div>
<div>This is Calendar View</div>
<div classname='container-fluid' >
<OwlCarousel classname="owl-theme" options={options} margin={4}>
<div>
<img classname="img" src= {'../assets/img/completed_case_1.png'} height="250px"/>
<img classname="img" src= {'../assets/img/completed_case_2.png'} height="250px"/>
<img classname="img" src= {'../assets/img/completed_case_3.png'} height="250px"/>
<img classname="img" src= {'../assets/img/gallery_4.png'} height="250px"/>
<img classname="img" src= {'../assets/img/gallery_5.png'} height="250px"/>
</div>
</OwlCarousel>
</div>
</div>
);
}
}
这是输出正在得到