xingmingyi_applet/pages/index/school/school.vue

<template>
	<view class="pageCon">
		<view class="top dfsb">
			<view @click="sectionChange(item.id)" :class="[type == item.id ? 'sel' : '', 'li']" v-for="(item, index) in school_type" :key="index">{{ item.name }}</view>
		</view>
		<view class="conwarp"><list :flag="1" :list="schoolList"></list></view>
	</view>
</template>

<script>
import list from './componets/list.vue';
export default {
	components: {
		list
	},
	data() {
		return {
			school_type: [],
			type: 0,
			schoolList: [
				// { image: '/static/img/pro/indnotice.png', name: '知识过关', path: '/pages/knowledge/knowledge' },
			],
			page: 1,
			pagnum: 6
		};
	},
	onPullDownRefresh() {
		this.page = 1;
		this.schoolList = [];
		setTimeout(res => {
			uni.stopPullDownRefresh();
		}, 1000);
	},
	onLoad(opt) {
		this.type = opt.type || '';
		this.getInfoList();
	},
	onReachBottom() {
		if (this.status == 'nomore') return;
		this.status = 'loading';
		this.page = ++this.page;
		this.getInfoList();
	},
	methods: {
		sectionChange(index) {
			this.type = index;
			this.page = 1;
			this.schoolList = [];
			this.getInfoList();
		},
		getInfoList() {
			this.status = 'loadmore';
			this.$api
				.request('index/getSchoolList', {
					type: this.type,
					page: this.page,
					limit: this.pagnum
				})
				.then(data => {
					console.log(data);
					if (data.code == 200) {
						this.school_type = data.data.school_type;
						this.schoolList = this.schoolList.concat(data.data.list);
						if (data.data.list.length < this.pagnum) {
							this.status = 'nomore';
						}
					} else {
						this.$api.toast(data.msg);
					}
				});
		},
		toNext(url) {
			uni.navigateTo({
				url: url
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.pageCon {
	.top {
		padding: 22rpx 0;
		background-color: #fff;
		justify-content: center;
		.li {
			padding: 11rpx 18rpx;
			border: 1px solid #666666;
			margin-left: -1rpx;
			&:first-of-type {
				border-radius: 8rpx 0 0 8rpx;
			}
			&:last-of-type {
				border-radius: 0 8rpx 8rpx 0;
			}
		}
		.sel {
			border: 1px solid #025b58;
			background: rgba(2, 91, 88, 0.1);
			color: #025b58;
		}
	}
	.conwarp {
		background: #ffffff;
		margin-top: 20rpx;
		padding: 0 30rpx;
	}
}
</style>