drinkwd
- 发布：2022-10-03 10:58
- 更新：2022-10-11 10:31
- 阅读：290
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： windows10
HBuilderX类型： 正式
HBuilderX版本号： 3.6.4
手机系统： Android
手机系统版本号： Android 12
手机厂商： 小米
手机机型： 红米k30至尊纪念版
页面类型： nvue
vue版本： vue2
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
style：
/一行两个的样式 start/
.v-column2{
/ #ifndef APP-NVUE /
display: flex;
/ #endif /
flex-direction: row;
justify-content: center;
flex-wrap: wrap;
padding: 8rpx $content-spacer 0 $content-spacer;
}
.column2-img{
//margin:$spacer 0 0 $content-spacer;
width: (750rpx - $content-spacer*2)/2;
}
.containers{
width:750rpx
}
template：
<view class="containers">
<view class="v-column2">
<image
v-for="(fun, indexOff) in list"
key="indexOff"
style="{ height: height2(fun) }"
class="column2-img"
src="fun.IMAGE_URL"
@click="gotofunc(fun)"
></image
>
</view>
</view>
></image
>
</view>
</view>
操作步骤：
参照代码
参照代码
预期结果：
页面正常显示
页面正常显示
实际结果：
页面窜行
页面窜行
bug描述：
最新版本hbuilder 运行 样式异常 ，老版本没有这个问题。图片样式窜行了
drinkwd (作者)
在hello uni-app也可以复现新建nvue页面即可 复现代码如下 望回复
<template>
<view class="containers">
<view class="v-column2">
<image class="column2-img"
src="https://zsdq.dqdaily.com/p/CFPic/image/220211/c16d78092bc54fc3a73f2ad908afedf2.jpeg"></image>
<image class="column2-img"
src="https://zsdq.dqdaily.com/p/CFPic/image/220211/467e3fe2cc2140cc9524fe824d171c49.jpeg"></image>
</view>
</view>
</template>
<script>
export default {
data() {
return {
providerList: [],
version: ''
}
},
onLoad() {},
methods: {}
}
</script>
<style lang="scss">
.v-column2 {
display: flex;
flex-direction: row;
justify-content: center;
flex-wrap: wrap;
padding: 8rpx 8rpx 0 8rpx;
}
.column2-img {
width: (750rpx - 8rpx*2)/2;
}
.containers {
width: 750rpx
}
</style>
drinkwd (作者)
使用3.6.4.20220922默认基座可以复现问题，之前版本为3.5.3是好使的
2022-10-11 11:38
drinkwd (作者)
部分机型是正常的 目前发现红米k30至尊纪念版是有问题的。
2022-10-11 11:44
drinkwd (作者)
大佬有复现问题吗？
2022-10-13 10:18
DCloud_Android_ST
回复 drinkwd: 精度问题应该 你可以对column2-img裁剪小一些
2022-10-13 10:55
drinkwd (作者)
回复 DCloud_Android_ST: 好的 谢谢
2022-10-13 11:44
drinkwd (作者)
回复 DCloud_Android_ST: 但是还想了解一下为什么有的机型是好使的呢
2022-10-13 11:45
DCloud_Android_ST
回复 drinkwd: rpx会涉及屏幕宽度 有些手机的屏幕计算时容易出现精度丢失 排版时容易出现宽度不够
2022-10-13 14:21