公告列表
公告列表
收藏
回答

swiper的previous-margin无效

框架类型 API/组件名称 终端类型 操作系统 微信版本 基础库版本
小程序 swiper 微信iOS客户端 6.6.5 1.9.1


1、在开发者工具上，previous-margin无效。

在安卓【荣耀9】机子上，previous-margin和next-margin的值没有均分，swiper组件上分配的值是一样的大小，并且加上swiper-item的大小不超过总容器大小。

在IOS【苹果5】机子上previous-margin和next-margin均失效。


2、由于该组件是修改swiper-item的style值，导致我想改变当前显示的滑块样式失败。


<swiper class="swiper-container" current="{{detail.currSlideIndex}}" previous-margin="35rpx" next-margin="35rpx" bindchange="swiperChange">
   <swiper-item class="swiper-slide {{index===detail.currChangeIndex? 'active':'other'}}" wx:for="{{detail.slides}}" wx:key="index">
      <image src="{{item}}" mode="aspectFill">image>
   swiper-item>
 swiper>
.swiper-container .swiper-slide{
 width: 570rpx;
 height: 435rpx;
}
.swiper-container .active{
 width: 640rpx;
 height: 480rpx;
}





演示如下：


开发者工具演示



荣耀9演示



上面两张是苹果5演示效果


最后一次编辑于  2018-03-07
回答关注问题邀请回答
收藏

5 个回答

  • Fidelity
    Fidelity
    2019-08-07

    一年多了这 bug 都没修复??? wc...人家 issue 写的比你们文档都还详细...有时间不修复 bug, 尽是瞎改 api ...

    -------------------------------------------------------

    破案了.... swiper-item 里面的元素必须是 display: inline 行内元素, 然而 "微信 ide"这个 user-agent 会自动将 image 的标签加上 display: inline-block.

    2019-08-07
    有用 1
    回复 2
    • 棉花糖
      棉花糖
      2020-01-16
      是说要手动将image组件设置为inline属性吗？
      2020-01-16
      赞
      回复
    • D.
      D.
      2022-07-25
      感谢感谢
      2022-07-25
      赞
      回复
  • 。
    。
    2018-05-17

    我的怎么在测试工具里都不显示呢


    2018-05-17
    有用
    回复 10
    • 棉花糖
      棉花糖
      2018-05-17
      是新版本吗？他这个功能是后来增加的。
      2018-05-17
      赞
      回复
    • 。
      。
      2018-05-17回复棉花糖
      那怎么样才能使用这个呢 我想实现三张图片 中间大 两边显示一部分
      2018-05-17
      赞
      回复
    • 棉花糖
      棉花糖
      2018-05-17回复。
      不知道问题解决了没有，我现在没有用这个功能。 真机上是不兼容的
      2018-05-17
      赞
      回复
    • 。
      。
      2018-05-17回复棉花糖
      好 好像只能用 movable那个组件 自己写
      2018-05-17
      赞
      回复
    • 。
      。
      2018-05-17回复棉花糖
      不是 就在swiper 组件下面的另一个组件 应该也可以实现 不过应该挺麻烦
      2018-05-17
      赞
      回复
    查看更多(5)
  • 棉花糖
    棉花糖
    2018-04-09

    @官方，真机上swiper设置previous-margin表现不一致

    2018-04-09
    有用
    回复
  • 棉花糖
    棉花糖
    2018-03-09

    没有，

    2018-03-09
    有用
    回复
  • nicole
    nicole
    2018-03-09

    我也遇到同样的问题，请问解决了吗？

    2018-03-09
    有用
    回复
请 登录 后发表内容
相关问题
相关文档