如何自定义swiper滚动组件的分页器样式？

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

原文示例为：本文实例为大家分享了swiper自定义分页器的样式代码，供大家参考，具体内容如下+js主要代码+pagination: { // 自定义分页器的类名----必填项 el: 'custom-pagination', // 是否可点击----必填项 }

改写后为：本文展示了如何自定义swiper分页器样式，代码如下+js核心代码+分页配置：{ // 分页器类名——必填 el: 'custom-pagination', // 是否可点击——必填 }

本文实例为大家分享了swiper自定义分页器的样式代码，供大家参考，具体内容如下

js主要代码

pagination: { // 自定义分页器的类名----必填项 el: '.custom-pagination', // 是否可点击----必填项 clickable: true, // 分页的类型是自定义的----必填项 type: 'custom', // 自定义特殊类型分页器，当分页器类型设置为自定义时可用。 renderCustom: function (swiper, current, total) { console.log(current);//1 2 3 4 } },

一、el

分页器容器的css选择器或HTML标签。分页器等组件可以置于container之外，不同Swiper的组件应该有所区分，如#pagination1，#pagination2。