
该方案可以捕捉到swiper单屏内
点击不同元素的
事件。常用方式使用swiper只能说判断到点击了第几屏,并不能判断点击了第几屏里的哪一个元素并传递数据触发对应事件执行。特别是首屏,因为第一屏的结构是swiper复制多出的一屏没有绑定click的方法。(此处特指循环轮播的swiper)原因:重复点击是有冒泡事件导致的。 解决: Click me, and my parent's `onClickCapture` will fire *first*! 当点击handleClickViaCapturing事件触发时,会自动调用stopPropagation,handleClick不会执行。 只要就是 onClickCapture capture函...首先加载插件,需要用到的文件有swiper.min.js和swiper.min.css文件。可下载Swiper文件或使用CDN。
<div class="swiper-container">
</div>
<!-- 如果需要分页器 -->
<div class="swiper-pagination"></div>
<!-- 如果需要导航按钮 -->
<div class="swiper-button-prev"></div>
<!-- 如果需要滚动条 -->
</div>
导航等组件可以放在container之外
思路很简单:在swiper组件内部添加两个image组件,绑定点击事件,动态改变swiper中的current值。
评论列表(0条)