swiper中的双向控制器不生效问题

<!-- Swiper -->
<div class="swiper mySwiper1">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="image/hotel.png" /></div>
</div>
<div class="swiper-button-next"> </div>
<div class="swiper-button-prev"> </div>
</div>
<div class="swiper mySwiper2">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="image/hotel.png" /></div>
</div>
</div>
<p>
<script type="text/javascript">// <![CDATA[
	 var Swiper1 = new Swiper(".mySwiper1", {
		 loop: true,
	   navigation: {
	     nextEl: ".swiper-button-next",
	     prevEl: ".swiper-button-prev",
	   },
	 });
	 var Swiper2 = new Swiper(".mySwiper2", {
		 loop: true,
	   navigation: {
	     nextEl: ".swiper-button-next",
	     prevEl: ".swiper-button-prev",
	   },
	 });
	 Swiper1.controller.control = Swiper2;//需要在Swiper2初始化后,Swiper1控制Swiper2
	 Swiper2.controller.control = Swiper1;//需要在Swiper1初始化后,Swiper2控制Swiper1
	
// ]]></script>
</p>


代码格式懒得整理了,swiper双向控制要注意的一点就是
Swiper1.controller.control = Swiper2;
Swiper2.controller.control = Swiper1;
官方文档中,需要把params改成controller
其他不变即可
下方为官方文档:
Swiper1.params.control = Swiper2;//需要在Swiper2初始化后,Swiper1控制Swiper2
Swiper2.params.control = Swiper1;//需要在Swiper1初始化后,Swiper2控制Swiper1

  

 

posted @ 2021-12-08 10:53  文采呱呱  阅读(775)  评论(0编辑  收藏  举报