收藏
回答

求大神解决一下这个问题:flex iphone6 375x677 显示异常

问题模块 框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
API和组件 小程序 Bug flex 布局 工具 最新 2.3.0

- 当前 Bug 的表现(可附上截图)

小程序开发者工具,机型模拟 flex iphone6 375x677 显示异常,测试只有375屏宽机型异常,其它屏宽机型显示正常。wxss 中使用小程序提供的 rpx 计量单位,后附 wxml wxss 文件源码。



- 预期表现

正确显示如下图:


- 复现路径


- 提供一个最简复现 Demo

wxml 文件源码:

<view class="container1">

<view class="item1">1</view>

<view class="item1">2</view>

<view class="item1">3</view>

<view class="item1">4</view>

<view class="item1">5</view>

<view class="item1">6</view>

<view class="item1">7</view>

<view class="item1">8</view>

<view class="item1">9</view>

</view>


wxss 文件源码

.container1 {

height: 100%;

width: 686rpx;

background-color: rgb(255, 255, 255);

margin: auto; /*居中*/


display:flex; /*伸缩流布局*/

flex-wrap: wrap; /*换行*/

}


.item1 {

height: 210rpx;

width: 210rpx;

background-color: cyan;  

margin: 10rpx;

}


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

2 个回答

  • 卢霄霄
    卢霄霄
    2018-10-12

    210*3 + 10*2*3 = 690  你设的父组件宽686.。。为了防止rpx转px的误差,建议你设成693rpx

    2018-10-12
    赞同 1
    回复
  • 云南特产
    云南特产
    2018-10-12

    @卢霄霄,解决,谢谢大神。

    2018-10-12
    赞同
    回复 1
    • 卢霄霄
      卢霄霄
      2018-10-12

      不客气~ 用rpx的时候要小心,加起来凑总数的时候,最好都稍微留一点点余裕

      2018-10-12
      回复
登录 后发表内容