mm无捷之路
2019-08-06 17:50
采纳率: 33.3%
浏览 620

swiper的paginationRender如何与滑动事件一起使用?请教各位大佬

//swiper的paginationRender如何与滑动事件一起使用?
<br> var swiper = new Swiper(&#39;.vip_user_order&#39;, {<br> autoHeight: true, //enable auto height<br> pagination: &#39;.order_nav&#39;,<br> paginationClickable: true,<br> paginationBulletRender: function (swiper,index, className) {<br> switch (index) {<br> case 0: name=&#39;全部&#39;;break; <br> case 1: name=&#39;待付款&#39;;break;<br> case 2: name=&#39;待发货&#39;;break;<br> case 3: name=&#39;已成交&#39;;break;<br> default: name=&#39;&#39;;<br> }<br> return &#39;<a class="' + className + '">&#39; + name + &#39;</a>&#39;;<br> }<br> });<br> /* var Myswiper = new Swiper(&#39;.swiper-container&#39;, {<br> on:{ <br> slidePrevTransitionEnd:function(){<br> alert(&quot;后退&quot;);<br> },<br> slideNextTransitionEnd:function(){<br> alert(&quot;前行&quot;);<br> },<br> }<br> }); */<br>

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • mm无捷之路 2019-08-07 08:57
    已采纳

    已解决

        <script>
            var swiper = new Swiper('.vip_user_order', {
                onSlideChangeStart: function(swiper){
                    console.log(swiper.activeIndex);
                },
                autoHeight: true, //enable auto height
                pagination: '.order_nav',
                paginationClickable: true,
                paginationBulletRender: function (swiper,index, className) {
                switch (index) {
                  case 0: name='全部';break; 
                  case 1: name='待付款';break;
                  case 2: name='待发货';break;
                  case 3: name='已成交';break;
                  default: name='';
                }
                      return '<a class="' + className + '">' + name + '</a>';
                  }
            });
        </script>
    
    点赞 打赏 评论

相关推荐