<view class="content">
<image class="logo" src="/static/logo.png"></image>
<list ref="list" class="text-area" @loadmore="onLoadmore">
<cell>
<view class="title">
<text >{{title}}</text>
</view>
</cell>
</list>
</view>
</template>
<script>
export default {
data() {
return {
title: 'Hello'
}
},
onLoad() {
},
methods: {
onLoadmore(e) {
console.log(e)
setTimeout(() => {
this.$refs.list.resetLoadmore()
}, 500)
},
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex: 1;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
margin-left: auto;
margin-right: auto;
margin-bottom: 50rpx;
}
.text-area {
width: 750rpx;
display: flex;
justify-content: center;
flex: 1;
}
.title {
font-size: 36rpx;
height: 1000px;
background-color: red;
}
</style>
- 发布:2023-01-29 18:15
- 更新:2023-02-11 13:25
- 阅读:854
产品分类: uniapp/App
PC开发环境操作系统: Mac
PC开发环境操作系统版本号: 11.6.8 (20G730)
HBuilderX类型: 正式
HBuilderX版本号: 3.6.18
手机系统: Android
手机系统版本号: Android 12
手机厂商: OPPO
手机机型: iqoo,谷歌模拟器
页面类型: nvue
vue版本: vue2
打包方式: 云端
项目创建方式: HBuilderX
示例代码:
操作步骤:
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<list ref="list" class="text-area" @loadmore="onLoadmore">
<cell>
<view class="title">
<text >{{title}}</text>
</view>
</cell>
</list>
</view>
</template>
<script>
export default {
data() {
return {
title: 'Hello'
}
},
onLoad() {
},
methods: {
onLoadmore(e) {
console.log(e)
setTimeout(() => {
this.$refs.list.resetLoadmore()
}, 500)
},
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex: 1;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
margin-left: auto;
margin-right: auto;
margin-bottom: 50rpx;
}
.text-area {
width: 750rpx;
display: flex;
justify-content: center;
flex: 1;
}
.title {
font-size: 36rpx;
height: 1000px;
background-color: red;
}
</style>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<list ref="list" class="text-area" @loadmore="onLoadmore">
<cell>
<view class="title">
<text >{{title}}</text>
</view>
</cell>
</list>
</view>
</template>
<script>
export default {
data() {
return {
title: 'Hello'
}
},
onLoad() {
},
methods: {
onLoadmore(e) {
console.log(e)
setTimeout(() => {
this.$refs.list.resetLoadmore()
}, 500)
},
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex: 1;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
margin-left: auto;
margin-right: auto;
margin-bottom: 50rpx;
}
.text-area {
width: 750rpx;
display: flex;
justify-content: center;
flex: 1;
}
.title {
font-size: 36rpx;
height: 1000px;
background-color: red;
}
</style>
预期结果:
安卓上 list 组件滑动到底部才触发 @loadmore 事件
安卓上 list 组件滑动到底部才触发 @loadmore 事件
实际结果:
安卓上 list 组件每次滑动都触发 @loadmore 事件
安卓上 list 组件每次滑动都触发 @loadmore 事件
bug描述:
安卓上 nvue 的 list 组件触发 loadmore 事件触发异常,一直触发,每次滑动都触发一次(没有滑动到底),iOS 上无此问题。
使用 hbuilder 创建的新的空项目也会如此。
复现demo已上传到附件
广州极智 (作者)
这个bug也可以帮忙修复一下吗,复现demo 就是你们的 uniapp app 。https://ask.dcloud.net.cn/question/160660
2023-02-13 10:17