<template>
<view class="content">
<scroll-view scroll-y="true" id="box" :show-scrollbar="true" ref="scroller" class="list">
<view v-for="(item,index) in 2000" :key="index" class="item">
<text>{{item}}</text>
</view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
title: 'Hello'
}
},
onLoad() {
},
methods: {
}
}
</script>
<style lang="scss">
.content {
.list{
width: 750rpx;
height: 900rpx;
flex-direction: row;
flex-wrap: wrap;
.item{
width: 80rpx;
height: 80rpx;
// background-color: #999;
}
}
}
</style>
2***@qq.com
- 发布：2022-11-09 10:27
- 更新：2022-11-09 11:23
- 阅读：436
【报Bug】nvue页面中的scroll-view在ios中无法滚动
分类：uni-app
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： win10
HBuilderX类型： 正式
HBuilderX版本号： 3.6.4
手机系统： iOS
手机系统版本号： iOS 16
手机厂商： 苹果
手机机型： iphone Xs Max
页面类型： nvue
vue版本： vue2
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
1
1
预期结果：
1
1
实际结果：
1
1
2***@qq.com (作者)
加了，高度是撑开的，横向滚动可以，纵向滚动就不行
2022-11-09 11:37
DCloud_iOS_WZT
回复 2***@qq.com: flex-direction: row; 这个去掉
2022-11-09 12:02
2***@qq.com (作者)
回复 DCloud_iOS_WZT: 我就是想要横向布局的，然后换行的，就类似答题卡的序号排版
2022-11-09 12:08
DCloud_iOS_WZT
回复 2***@qq.com: 那你不要在scrollview 上加 里面加个view
2022-11-09 12:34
2***@qq.com (作者)
回复 DCloud_iOS_WZT:去掉了也还是不能滚动
2022-11-09 12:52
DCloud_iOS_WZT
回复 2***@qq.com: display: flex;
flex: 1;
flex-direction: column; 你给scrollview加上 另外你可以参考一下官方示例 你这个css写的有问题
2022-11-09 15:16
2***@qq.com (作者)
回复 DCloud_iOS_WZT: 感谢您的回复，您建议的方案确实可以滚动，但是满足不了我的需求，您可能没注意我用的是nvue，不写display:flex;应该是不影响的
2022-11-09 15:56
DCloud_iOS_WZT
回复 2***@qq.com: HBuilder 里有很多nvue下的列表示例 你这边创建个示例工程参考一下~
2022-11-09 16:01
DCloud_iOS_WZT
回复 2***@qq.com: hello uniapp 或者 新闻咨询模板
2022-11-09 16:03