收藏
回答

swiper组件滑动swiper-item之间有一条白线

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug swiper 微信安卓客户端 不清楚,真机调试 好像所有都有这个问题
<view class="container">
  <view class="swiper-box">
    <swiper indicator-dots="{{true}}">
      <swiper-item>
        <view class="swiper-item-view">
          <view class="swiper-item-title">xxxx</view>
          <view class="swiper-item-user-info">
            <view class="swiper-item-user-info-img"></view>
            <view class="swiper-item-user-info-name"></view>
            <view class="swiper-item-user-info-num"></view>
          </view>
        </view>
      </swiper-item>
      <swiper-item>
        <view class="swiper-item-view">
          <view class="swiper-item-title">xxxx</view>
          <view class="swiper-item-user-info">
            <view class="swiper-item-user-info-img"></view>
            <view class="swiper-item-user-info-name"></view>
            <view class="swiper-item-user-info-num"></view>
          </view>
        </view>
      </swiper-item>
    </swiper>
  </view>

swiper {
  height: 400rpx;
}


.swiper-item-view {
  height: 400rpx;
  background-color: #3296FA;
  position: relative;
}
.swiper-item-title {
  text-align: center;
  font-size: 30rpx;
  padding: 10rpx;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
}


回答关注问题邀请回答
收藏

5 个回答

  • 社区技术运营专员-Jahozheng
    社区技术运营专员-Jahozheng
    2022-02-28

    这是css transform 属性在非整数 DPR 机器下的 bug,只能通过调整一下 swiper 宽高等各种 css 来尝试绕过

    2022-02-28
    有用
    回复
  • 清香的orange
    清香的orange
    2021-05-20

    我也遇到了,请问解决了吗?复现代码片段:https://developers.weixin.qq.com/s/ljrrFrm27Jq7

    2021-05-20
    有用
    回复
  • Mr.S
    Mr.S
    2020-04-07

    banner 轮播 为什么左右两边会有1px的白线

    2020-04-07
    有用
    回复 1
    • 呦,明静 🌀
      呦,明静 🌀
      2023-05-30
      我也遇到这个问题了,在微信开发者工具上有这个问题,真机预览又没有问题
      2023-05-30
      回复
  • 疯狂的小辣椒
    疯狂的小辣椒
    2020-03-13

    你好,我测试没有复现,机型信息如下图,麻烦你用出现问题的手机扫下面的小程序码提供下扫码结果截图

    2020-03-13
    有用
    回复 3
    • 张尧
      张尧
      2020-03-13
      2020-03-13
      1
      回复
    • 张尧
      张尧
      2020-03-13
      我真机调试时候如果慢慢滑动这条线一闪一闪,如果快速滑动就一直都有
      2020-03-13
      1
      回复
    • 风吹麦田的声音
      风吹麦田的声音
      2020-09-15回复张尧
      楼主解决了吗? 我也碰到同样的问题
      2020-09-15
      回复
  • 子不语
    子不语
    2020-03-13

    你好,请提供能复现问题的简单代码片段

    https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

    --↓↓👍如果觉得有帮助的话请点个【赞】吧(唏嘘也有小尾巴了,可惜是假的)

    2020-03-13
    有用
    回复 10
    • 张尧
      张尧
      2020-03-13
      https://developers.weixin.qq.com/s/GBICfOmh79fs
      2020-03-13
      回复
    • 张尧
      张尧
      2020-03-13
      我调试半天不知道什么问题,把第一个swiper-item中的<view class="swiper-item-title">xxxx</view>注释掉就没有这个问题了,好奇怪
      2020-03-13
      回复
    • 子不语
      子不语
      2020-03-13回复张尧
      你把另一个swiper-item 改个颜色试试看?

      --↓↓👍如果觉得有帮助的话请点个【赞】吧(唏嘘也有小尾巴了,可惜是假的)

      2020-03-13
      回复
    • 张尧
      张尧
      2020-03-13
      设计稿是要同一个颜色的,改为其他的是看不出来这个问题的
      2020-03-13
      回复
    • 子不语
      子不语
      2020-03-13回复张尧
      看代码没看出来有啥问题,可能是我太菜了吧

      --↓↓👍如果觉得有帮助的话请点个【赞】吧(唏嘘也有小尾巴了,可惜是假的)

      2020-03-13
      回复
    查看更多(5)
登录 后发表内容
问题标签