首页 > 代码库 > Swiper的使用心得

Swiper的使用心得

个人觉得:Swiper是一个好用有方便的手机端插件,但也正是因为它已经被封装好了,所有有些个性化的需求、设计不是那么好人为干预,所以在实用的时候也碰到不少头疼的问题。

下面是我在写代码的时候遇到的一些问题和解决的方法,可能解决的并不完美,存在bug,希望前辈们批评指正

1.有时候我们希望页面中显示两个或者多个swiper-slide时,设置slidesPerView属性值,默认值为1,参数是类型:number 或者 auto。如果属性值为auto的话,则是根据sildes的宽度来设置数量(不建议使用这个属性,对布局的可控性感觉不是那么好),loop模式下还需要设置另一个参数loopedSlides。

 

2.有的时候我们不希望每个swiper-slide都紧挨着,能有相同的间距,又不想加padding或者margin,担心影响布局或者性能,那么这个时候,可以设置spaceBetween属性,单位是px

 

3.和angularjs结合来使用的时候,通过ng-repeat创建出来的swiper-slide,会出现无法滑动,布局变形等情况,这时候,设置

observer:true;  //修改Swiper自己或子元素时初始化Swiper

observeParents:true; //修改Swiper的父元素时,自动初始化Swiper

Swiper的使用心得