fix: preserve practice selections when loading more

pagesMy/practice.vue

@@ -17,7 +17,7 @@
 		<template v-if="tidx===1">
 			<view class="list" v-if="list.length">
 				<up-list @scrolltolower="scrolltolower" style="height: 100%;">
-					<up-list-item v-for="(item, index) in list" :key="index">
+					<up-list-item v-for="(item, index) in list" :key="item.activityId">
 						<practice-box :item="item" @itemCheck="handleCheck"></practice-box>
 					</up-list-item>
 				</up-list>
@@ -30,7 +30,7 @@
 		<template v-else-if="tidx===2">
 			<view class="list" v-if="yslList.length">
 				<up-list @scrolltolower="scrolltolower" style="height: 100%;">
-					<up-list-item v-for="(item, index) in yslList" :key="index">
+					<up-list-item v-for="(item, index) in yslList" :key="item.id">
 						<view class="ysl-box">
 							<view class="ysl-box-title">证书编号：{{item?.certificateNumber||''}}</view>
 							<view class="ysl-box-tip">申领时间：{{item?.createDate||''}}</view>
@@ -66,6 +66,7 @@
 		memberId:''
 	})
 	const isOver = ref(false)
+	const isLoading = ref(false)
 	const memberList = ref([])
 	const list = ref([])
 	const yslList = ref([])
@@ -102,11 +103,18 @@
 	}
 	
 	const scrolltolower = () => {
-		if(isOver.value) return
-		getDataByTab()
+		// 触底只加载下一页；getDataByTab 会重置列表，导致已勾选记录被清空。
+		if(isOver.value || isLoading.value) return
+		if(tidx.value===1){
+			getKslList()
+		}else if(tidx.value===2){
+			getYslList()
+		}
 	}
 	
 	const getKslList = () => {
+		if(isLoading.value) return
+		isLoading.value = true
 		proxy.$api.get('/core/social/practice/record/claimPage',queryParams.value).then(({data:res})=>{
 			if(res.code!==0) return proxy.$showToast(res.msg)
 			list.value = [...list.value,...res.data.list]
@@ -118,10 +126,14 @@
 			})
 			queryParams.value.page++;
 			if(res.data.list.length===0) isOver.value = true
+		}).finally(()=>{
+			isLoading.value = false
 		})
 	}
 	
 	const getYslList = () => {
+		if(isLoading.value) return
+		isLoading.value = true
 		proxy.$api.get('/core/social/practice/record/claimedPage',queryParams.value).then(({data:res})=>{
 			if(res.code!==0) return proxy.$showToast(res.msg)
 			yslList.value = [...yslList.value,...res.data.list]
@@ -130,6 +142,8 @@
 			})
 			queryParams.value.page++;
 			if(res.data.list.length===0) isOver.value = true
+		}).finally(()=>{
+			isLoading.value = false
 		})
 	}
 	

tests/practice-page-refresh.test.js

@@ -76,3 +76,13 @@ test('查看社会实践详情返回后姓名筛选请求不复用记录分页',
   assert.deepEqual(memberRequests.map(item => item.params.page), [1, 1])
   assert.deepEqual(memberRequests.map(item => item.params.limit), [-1, -1])
 })
+
+test('触底只加载下一页，不重置已选择的可申领记录', () => {
+  const source = fs.readFileSync(practiceFile, 'utf8')
+  const scrollToLower = source.match(/const scrolltolower = \(\) => \{([\s\S]*?)\n\t\}/)[1]
+
+  assert.doesNotMatch(scrollToLower, /getDataByTab\(\)/)
+  assert.match(scrollToLower, /getKslList\(\)/)
+  assert.match(scrollToLower, /getYslList\(\)/)
+  assert.match(scrollToLower, /isLoading\.value/)
+})