判断一个div内滚动是否触底加载内容

最新推荐文章于 2022-08-21 15:51:44 发布

XPX17

最新推荐文章于 2022-08-21 15:51:44 发布

阅读量312

点赞数

分类专栏： vue javascript

本文链接：https://blog.csdn.net/qq_35547053/article/details/125147401

版权

Vue.js scroll-view 滚动事件加载更多列表渲染

关键词由CSDN通过智能技术生成

javascript 同时被 2 个专栏收录

12 篇文章 0 订阅

订阅专栏

vue

10 篇文章 0 订阅

订阅专栏

//html
<scroll-view scroll-y="true" @scroll.passive="getScroll($event)" style="height:330px;margin-top: 30rpx;">
	<view class="gongshi-list" v-for="(item,index) in aginList">
		<view class="gongshi-list-name">{{item.name}}</view>
		<view class="gongshi-list-text">{{item.title}}</view>
		<view class="gongshi-list-money">￥{{item.money}}</view>
	</view>
</scroll-view>


//js
getScroll(event) {
    let me = this
	let scrollTop = event.target.scrollTop //滚动的距离
	let scrollHeight = event.target.scrollHeight  //内容的高度
	if (scrollHeight === scrollTop + 330) {
		console.log("到底了")
		if (me.aginList.length < me.pages * 6) {
				return me.$refs.uTips.show({
					title: '没有更多了',
					type: 'error'
				});
			}
			me.pages++
			me.get_list()
		}
},