2 回答

TA貢獻(xiàn)1854條經(jīng)驗(yàn) 獲得超8個(gè)贊
要調(diào)用 OwlCarousel 的方法,您應(yīng)該將 ref 放在 react OwlCarousel 元素上并將其附加到此,然后在此調(diào)用方法,例如:
export class Owldemo1 extends Component {
click = ()=>{
console.log(this.slider);
this.slider.next(500)
}
render() {
return (
<div>
<button onClick={this.click} className="btn btn-info">
salam
</button>
<OwlCarousel items={5}
className="owl-theme"
loop
nav
margin={10}
ref={slider => (this.slider = slider)}
>
<div><img className="img" src="https://picsum.photos/seed/1/200/300"/></div>
<div><img className="img" src="https://picsum.photos/seed/2/200/300"/></div>
<div><img className="img" src="https://picsum.photos/seed/4/200/300"/></div>
<div><img className="img" src="https://picsum.photos/seed/3/200/300"/></div>
<div><img className="img" src="https://picsum.photos/seed/5/200/300"/></div>
<div><img className="img" src="https://picsum.photos/seed/6/200/300"/></div>
<div><img className="img" src="https://picsum.photos/seed/7/200/300"/></div>
</OwlCarousel>
</div>
)
}
}

TA貢獻(xiàn)1840條經(jīng)驗(yàn) 獲得超5個(gè)贊
第 1 步 - 在您的構(gòu)造函數(shù)中創(chuàng)建將在第 2 步中傳遞給 OwnCaroussel 的選項(xiàng)對(duì)象
構(gòu)造函數(shù)(){ 超級(jí)(); this.options = { onInitialized: function(){ this.carousel = this; } };
第 2 步 - 將選項(xiàng)傳遞給 OwlCarousel,如下所示 <OwlCarousel {...this.options}>
第 3 步 - 現(xiàn)在您可以調(diào)用輪播的任何方法 - 例如 -
this.carousel.next() 或 this.carousel.prev() 等
添加回答
舉報(bào)