shop-app/components/BsChoiceGoods.vue

<!--
 * @Author: ch
 * @Date: 2022-03-20 16:45:27
 * @LastEditors: ch
 * @LastEditTime: 2022-04-21 16:48:27
 * @Description: file content
-->
<template>
	<view>
		<UiGoodsGroup :listData="listData"></UiGoodsGroup>
		<u-loadmore :status="loadingStatus" color="#ccc" nomoreText="我也是有底线的啦~" />
	</view>
</template>
<script>
import {ApiGetGoodsList} from '@/common/api/goods';
import BsEmpty from './BsEmpty.vue';
import UiGoodsGroup from './UiGoodsGroup.vue';
export default {
	components: { BsEmpty, UiGoodsGroup },
	data(){
		return {
			loadingStatus : 'loading',
			listData : [],
			params : {
				length : 15,
				pageIndex : 1
			}
		}
	},
	mounted(){
		this.getGoodsList();
	},
	methods : {
		async getGoodsList(){
			this.loadingStatus = 'loading';
			const query = this.$Route.query;
			const {error, result} = await ApiGetGoodsList({
				...this.params
			});
			this.listData = this.listData.concat(result.records);
			
			// 标记是否为最后一页
			if(!result.records.length < this.params.length){
				this.loadingStatus = 'nomore';
			}
		},
		next(){
			if(this.loadingStatus === 'nomore'){
				return false
			}
			this.params.pageIndex++;
			this.getGoodsList();
		}
	}
}
</script>
<style lang="scss" scoped>
</style>