【代码】uni-app中触底事件(scrolltolower)不触发的解决方案

1. 首先是要给scroll-view给定一个高度，最好不要是100%那种的，很容易无效。

2. 他的父容器最好也是给指定一个高度

直接上一个例子

模板

<template>
        <view class="main_box">
		<view class="thelist m_list">
			<!-- 予約オ—ダ -->
			<scroll-view class="ykodList" scroll-y="true" @scrolltolower="scrollToBottom">
				<view class="view-od-list">
				    ...
				</view>
			</scroll-view>
		</view>
	</view>
</template>

JS

<script>
    export default {
        methods: {
			scrollToBottom:(e)=>{
				
				console.log(e);
				...
			}
		}
    };
</script>

CSS

.main_box,.thelist{
	height: 100%;
	width: 100%;
}
.dtSwiper{
	width: 100%;
	/* 100vh是屏幕可见区域高度的100%,--window-top是屏幕顶栏的部分,calc()是动态计算函数 */
	height: calc(100vh - var(--window-top));
}

微信扫码查看本文