微信小程序swiper-dot如何将点改成滑块？长尾关键词：微信小程序swiper-dot点改滑块教程

本文共计1060个文字，预计阅读时间需要5分钟。

目录 + 背景 + 目标效果 + 思路 + 实现 + Swiper 监听 change 事件 + 自定义 dot 模块 + change 事件中的逻辑 + 总结 + 本文主要介绍如何基于现有组件（如微信小程序的 swiper，以及我们平时 h5 用的 Swiper）实现类似功能。

目录

• 背景
• 目标效果
• 思路
• 实现
• swiper监听change
• 自定义dot模块
• change事件中的逻辑
• 写在最后

本文主要介绍如何基于已有的组件（比如微信小程序的swiper，还有我们平时h5用的比较多的swiper.js等），实现一个滑块样式的指示面板。demo基于小程序，但是逻辑通用。

背景

最近要做一个新的小程序，在首页部分有一个swiper模块，因为设计同学的出色发挥😭，让我在枯燥的开发中得到了些许快乐。他们将swiper中指示面板中的点，改成了一个滑块，说实话，老老实实整成一排点它不香么，哈哈哈哈。