邓洁 : 首页分页加载

pages/index/index.vue

@@ -18,8 +18,8 @@
 					<text>找店列表</text>
 				</view>
 			</view>
-			<SearchShopList v-if="chooseIndex" :searchInfoList="searchInfoList"/>
-			<ShowShopList v-else :shopInfoList = "shopInfoList"/>
+			<SearchShopList v-if="chooseIndex" :searchInfoList="searchInfoList" />
+			<ShowShopList v-else :shopInfoList="shopInfoList" />
 		</view>
 		<TabBar :current-page="0"></TabBar>
 	</view>
@@ -49,7 +49,8 @@
 				searchPageSize: 5,
 				shopPageNum: 1,
 				searchPageNum: 1,
-
+				shopListLength: '',
+				shopSearchListLength: '',
 			}
 		},
 		onLoad() {
@@ -61,11 +62,21 @@
 			this.open()
 			this.getClassList()
 		},
+		onReachBottom() {
+			if (this.chooseIndex == 0 && this.shopListLength !== 0) {
+				this.shopPageNum++
+				this.getShopList()
+			}
+			if (this.chooseIndex == 1 && this.shopSearchListLength !== 0) {
+				this.searchPageNum++
+				this.getSearchList()
+			}
+		},
 		methods: {
 			getBanner() {
 				this.$api.getBanner().then(res => {
-					res.data.data.forEach(item=>{
-						item.img =this.$api.imgUrl + item.img
+					res.data.data.forEach(item => {
+						item.img = this.$api.imgUrl + item.img
 					})
 					this.swiperList = res.data.data
 					// .map(item => this.$api.imgUrl + item.img)
@@ -81,35 +92,37 @@
 					this.statNum = res.data.data
 				})
 			},
-			getShopList(){
+			getShopList() {
 				const query = this.$u.queryParams({
 					type: 1,
 					pageSize: this.shopPageSize,
 					pageNum: this.shopPageNum
 				})
 				this.$api.getShopList(query).then(res => {
-					this.shopInfoList = res.data.data
-					this.shopInfoList.forEach(item=>{
-						item.pics =this.$api.imgUrl + item.pics
+					res.data.data.forEach(item => {
+						item.pics = this.$api.imgUrl + item.pics
 					})
+					this.shopListLength = res.data.data.length
+					this.shopInfoList = [...this.shopInfoList, ...res.data.data]
 				})
 			},
-			getSearchList(){
+			getSearchList() {
 				const query = this.$u.queryParams({
 					type: 2,
 					pageSize: this.searchPageSize,
 					pageNum: this.searchPageNum
 				})
 				this.$api.getShopList(query).then(res => {
-					this.searchInfoList = res.data.data
+					this.shopSearchListLength = res.data.data.length
+					// 用于触底刷新  为数据赋值：通过展开运算符的形式，进行新旧数据的拼接
+					this.searchInfoList = [...this.searchInfoList, ...res.data.data]
 					console.log(this.searchInfoList);
 				})
-			}
-			,
+			},
 			getClassList() {
 				this.$api.getClassList().then(res => {
 					let data = res.data.data
-					data.sort((a,b)=>{
+					data.sort((a, b) => {
 						return a.id - b.id
 					})
 					data = data.map(item => item.name)