收藏
回答

swiper轮播第一张不显示

问题模块
API和组件

在iOS设备上,swiper组件的第一张图片不显示,只有往右滑动一下才显示

最后一次编辑于  2017-08-21  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏投诉关注问题回答

11 个回答

  • Kevin·Yang
    Kevin·Yang
    2017-08-21

    js:

    movies: [

          { url: '/wxxcx/banner_01.jpg' },

          { url: '/wxxcx/banner_02.jpg' },

          { url: '/wxxcx/banner_03.jpg' },

          { url: '/wxxcx/banner_04.jpg' },

        ],

    wxml:

    <swiper class="swiper" indicator-dots="true" autoplay="true" interval="3000" duration="1000">    

          <block wx:for="{{movies}}" wx:for-index="index">    

            <swiper-item>    

              <image src="{{item.url}}" class="slide-image" mode="aspectFill"/>    

            </swiper-item>    

          </block>    

        </swiper>

    wxss:

    /**图片滚动样式**/

    .swiper {

      height: 210px;

      width: 100%;

    }

    .swiper image {

      height: 100%;

      width: 100%;

    }

    我的案例,你可以试试,应该OK的

    2017-08-21
    赞同
    回复
  • A_Leo
    A_Leo
    2017-08-21

    这是本地的,在线图片你试过吗?

    2017-08-21
    赞同
    回复
  • Kevin·Yang
    Kevin·Yang
    2017-08-21

    我这就是在线的,你把这个

     { url: '/wxxcx/banner_01.jpg' },

          { url: '/wxxcx/banner_02.jpg' },

          { url: '/wxxcx/banner_03.jpg' },

          { url: '/wxxcx/banner_04.jpg' },

    链接地址换成在线地址就行,我只是把地址删了

    2017-08-21
    赞同
    回复
  • LastLeaf
    LastLeaf
    2017-08-21

    感谢反馈。在之前的版本中,iOS的本地图片可能会有不渲染的问题。麻烦看一下基础库v1.5.1是不是还有这个问题。

    2017-08-21
    赞同
    回复
  • 嘉泳✨
    嘉泳✨
    2017-08-23

    没有1.5.1的库啊

    2017-08-23
    赞同
    回复
  • LastLeaf
    LastLeaf
    2017-08-24

    没有v1.5.1基础库的话,麻烦更新一下微信版本

    2017-08-24
    赞同
    回复
  • 嘉泳✨
    嘉泳✨
    2017-08-24

    手机上的基础库能设置吗?不是只能获取到?

    2017-08-24
    赞同
    回复
  • LastLeaf
    LastLeaf
    2017-08-24

    不可以设置的,不同的微信版本会带上不同的基础库

    2017-08-24
    赞同
    回复
  • 远方
    远方
    2017-09-13

    你好,麻烦再帮我看看,轮播图为何不显示

    wxml:

    <swiper indicator-dots="{{indicatorDots}}"

       autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">

       <block wx:for="{{imgUrls}}">

         <swiper-item>

           <image src="{{item}}"  class="slide-image" mode="aspectFill" />

         </swiper-item>

       </block>

    </swiper>

    js:

    data:{

       indicatorDots: true,

       autoplay: true,

       circular: true,

       interval: 5000,

       duration: 1000,

       imgUrls: [

         '../tp/f1.jpg',

         '../tp/1.jpg',

         '../tp/3.png',

         '../tp/2.png',

       ]

    }

    2017-09-13
    赞同
    回复
  • LastLeaf
    LastLeaf
    2017-09-13

    请确认基础库版本不低于v1.5.3再试。具体请参考这个问题的讨论:


    https://developers.weixin.qq.com/blogdetail?action=get_post_info&lang=zh_CN&token=367915384&docid=209443751aaea2702bff70c1291ca96f

    2017-09-13
    赞同
    回复