求大神解决一下这个问题:flex iphone6 375x677 显示异常
发布于 5 年前 作者 luoguiying 3735 次浏览 来自 问答
  • 当前 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 回复

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

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

回到顶部