teaching-uniapp/pages/teachingList/teachingList.vue

<template>
	<view class="teachingList">
		<statusBar :item="navbarData"></statusBar>
		
		<view class="list">
			<scroll-view style="height: 100%;" scroll-y="true" refresher-enabled='true' :refresher-triggered="trigger"
					@refresherrefresh='pulling'  @scrolltolower="lower">
				<view>
					<listBlock1 ref="listBlock1" :classList='classList'></listBlock1>
				</view>
				<view class="loading">
					<view v-if="Loading==1">数据加载中...</view>
					<view v-if="Loading==2">没有更多了~~</view>
				</view>
			</scroll-view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				navbarData: {
					title: '推荐列表',
					btn: 1
				},

				// 控制刷新
				trigger: false, 
				// 渲染数据
				classList: [],
				// 触底加载动画提示
				Loading: 0, //0默认值  1加载中 2没有更多了
				currentPage: 1,
			};
		},
		methods: {
			// 资源库下拉刷新
			pulling() {
				this.trigger = true
				// this.isrepulling = true
				setTimeout(() => {
					this.trigger = false;
				}, 1000);
			
				// 资源库
				this.classList = []
				this.Loading = 0 //0默认值  1加载中 2没有更多了
				this.currentPage = 1 //页数

				this.getData()
			},
			// 触底
			lower() {
				console.log('没触底？');
				if (this.Loading == 2) return
				this.Loading = 1
				this.currentPage++
				setTimeout(this.getData, 1000)
			},
			// 获取页面数据
			getData() {
				let data = {
					openid: uni.getStorageSync('oId'),
					ty: 3,
					page: this.currentPage, //下拉获取更多的备用字段
					lim: 15 //一次获取多少数据
				}
				this.$request('/selectActivity', "POST", data).then(res => {
					console.log('获取数据', res[0]);
					
					if (!res[0].length) {
						this.Loading = 2
					} else {
						this.Loading = 0
					}
					// return
					this.classList = [...this.classList, ...res[0]]
					// this.trigger = false;
					// this.activeList = res[0]
				})
			},
		},
		// 触底加载更多
		// onReachBottom() {
		// 	if (this.newsLoading == 2) {
		// 		return
		// 	}
		// 	this.newsLoading = 1
		// 	this.currentPage++
		// 	setTimeout(this.getData, 2000)

		// },
		onLoad() {
			// this.getData()
		},
		onShow() {
			this.classList= []
			// 一进页面就加载数据
			this.getData()
			
			this.$refs.listBlock1.getdata()
			// this.$refs.listBlock1.getSub()
		}
	}
</script>

<style lang="scss">
	.teachingList {
		height: 100%;
		display: flex;
		flex-direction: column;
		.list{
			flex: 1;
		}
		.list1btn {
			z-index: 5;
			border: none;
			padding: 0;
			text-align: center;
			// padding: 8px, 24px, 8px, 24px;
			background-color: rgba(48, 129, 232, 1);
			color: #fff;
			border-radius: 100rpx;
			float: right;
			width: 144rpx;
			height: 48rpx;
			line-height: 48rpx;
			letter-spacing: 1px;
		}

		
	}
</style>