详细问题描述
在苹果手机上,使用scroll-view组件水平滑动时,如果每一项的内容不一致,会导致无法对齐,错位的问题
[内容]
重现步骤
[步骤]
1.创建 Hello-uni-app ,使用官方提供的demo,找到 pages>component>scroll-view>scroll-view.vue
2.修改scroll-view.vue中横向滚动的代码 <view id="demo2" class="scroll-view-item_H uni-bg-green">B</view>改为
<view id="demo2" class="scroll-view-item_H uni-bg-green">B
<view style="line-height: 90upx;">这是第一行</view>
<view style="line-height: 90upx;">这是第二行</view>
</view>
完整的横向滚动代码如下
<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120">
<view id="demo1" class="scroll-view-item_H uni-bg-red">A</view>
<view id="demo2" class="scroll-view-item_H uni-bg-green">B
<view style="line-height: 90upx;">这是第一行</view>
<view style="line-height: 90upx;">这是第二行</view>
</view>
<view id="demo3" class="scroll-view-item_H uni-bg-blue">C</view>
</scroll-view>
- 在苹果手机的浏览器上或者微信浏览器上运行该界面
[结果]
[期望]
能达到跟安卓手机上一样的效果
IDE运行环境说明
[HBuilderX]
[1.7.0.20190314]
[windows版本号]
uni-app运行环境说明
[运行端是h5]
[任意的苹果手机运行]
附件
[可重现代码片段]
<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120">
<view id="demo1" class="scroll-view-item_H uni-bg-red">A</view>
<view id="demo2" class="scroll-view-item_H uni-bg-green">B
<view style="line-height: 90upx;">这是第一行</view>
<view style="line-height: 90upx;">这是第二行</view>
</view>
<view id="demo3" class="scroll-view-item_H uni-bg-blue">C</view>
</scroll-view>
联系方式
[550129196]