ykcUniapp/pages/index/actionList.vue

<template>
	<view class="content">
		<view class="" style="height: 1rpx;"></view>
		<empty v-if="loaded === true && list.length === 0"></empty>
		<view class="action-wrap" v-for="item in list" @click="goAction(item)">
			<image :src="item.pics.split(',')[0]" mode=""></image>
		</view>
		<uni-load-more :status="loadingType"></uni-load-more>
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	import empty from '@/components/empty';
	import {getActionList} from '@/api/index.js'
	export default {
		components: {
			uniLoadMore,
			empty
		},
		data() {
			return {
				page: 1,
				limit: 10,
				loadingType: 'more',
				loaded: false,
				list: []
			}
		},
		onLoad(opt) {
	
		},
		onShow() {
			this.getList()
		},
		onReachBottom() {

		},
		onReady() {
			
		},
		methods: {
			goAction(item) {
				uni.navigateTo({
					url:'/pages/index/actionDetail?id=' + item.id
				})
			},
			getList() {
				let that = this
				if(that.loadingType == 'loading' || that.loadingType == 'noMore') {
					return
				}
				getActionList({
					page: that.page,
					limit: that.limit
				}).then(res => {
					let list = res.data
					that.list = that.list.concat(list)
					that.page++
					if(list.length == that.limit) {
						that.loadingType = 'more'
					}else {
						that.loadingType = 'noMore'
					}
					that.loaded = true
				})
			}
		}
	}
</script>

<style lang="scss">
	.action-wrap {
		width: 704rpx;
		height: 330rpx;
		margin:20rpx auto;
		image {
			
			width: 704rpx;
			height: 330rpx;
			border-radius: 20rpx;
		}
	}
</style>