小程序scroll-view标签没有实现横向滚动的问题及解决方法记录
scroll-view用于定义可滚动视图
【1】使用scroll-view做图片横向滚动,发现图片无法滚动,宽度被压缩
问题代码(仅贴出关键部分):
<scroll-view class='scrollEmoPic' scroll-x="true" >
<button class='emoPicUpload' bindtap='bindAddEmo'>
<view style='margin:0 30rpx'>相册</view>
</button>
<button class=' emoPicUpload' bindtap='bindInsertEmo'>
<view style='margin:0 30rpx'>上传</view>
</button>
<block wx:for="{{EmoPic}}">
<image class='scrollemoPicitem' src="{{item.url}}" bindtap='bindEmoPicChoose' data-src="{{item.url}}" />
</block>
</scroll-view>
关键样式:
.scrollEmoPic{flex-wrap: nowrap;display: flex}
.scrollemoPicitem{width: 100rpx; height: 100rpx; margin: 10rpx 10rpx;}