使用 swiper 轮播 echarts 图表，地图点击失效

本文主要是介绍使用 swiper 轮播 echarts 图表，地图点击失效，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

问题

使用 swiper 轮播 echarts 图表，地图点击失效，伪代码如下

<Swiper><SwiperSlide>...</SwiperSlide>// 轮播中有地图<SwiperSlide><EchartsMap/></SwiperSlide><SwiperSlide>...</SwiperSlide>
</Swiper>

地图中各省都是可以点击的，但是被Swiper包裹了之后点击失效

解决办法

有个API配置：touchStartPreventDefault
默认true，阻止touchstart (mousedown)的默认事件，设置为false不阻止即能点击

<Swiper touchStartPreventDefault={false} ><SwiperSlide>...</SwiperSlide>// 轮播中有地图<SwiperSlide><EchartsMap/></SwiperSlide><SwiperSlide>...</SwiperSlide>
</Swiper>

参考资料

https://blog.csdn.net/qq_43458637/article/details/122285484

这篇关于使用 swiper 轮播 echarts 图表，地图点击失效的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---