在page.json中配置下拉刷新和底部距顶部的距离:
{
"path": "school-detail",
"style": {
"navigationStyle": "custom",
"navigationBarTextStyle": "black",
"enablePullDownRefresh": true, //下拉刷新
"onReachBottomDistance":100 //底部距顶部的距离
}
},
如下页面接口,需要分页的页面,在后端接口中都需要page_size(一次加载的数据条数)
//推免信息
export const getExemption = async (id: number,pageSize: number): Promise<exemption> => {
try {
const res = await http<exemption>({
method: 'POST',
url: '/universityselectionserver/postgraduate-exemption',
data: {
token: memberStore.profile?.token,
user_id: memberStore.profile?.user_id,
college_code: 10486,
last_id: 0,
page_size: 10
}
});
return res.data;
} catch (error) {
console.error("Failed to fetch major score:", error);
return {} as exemption;
}
}
下面是在相应页面的页面刷新和分页的代码
const currentPage_exemption = ref(1);
const pageSize_exemption = ref(10);
const hasMore_exemption = ref(true);
//推免数据的分页加载和下拉刷新
const fetchExemption = async () => {
if(loading.value) return;
loading.value = true;
try {
const response = await getExemption(currentPage_exemption.value,pageSize_exemption.value);
console.log('推免数据:', response);
if(currentPage_exemption.value === 1) {
exemptionList.value = props.infoList;
}else {
exemptionList.value = [...exemptionList.value,...props.infoList];
}
hasMore_exemption.value = props.infoList.length >= pageSize_exemption.value;
}catch (error) {
console.error('获取推免数据失败', error);
}finally {
loading.value = false;
uni.stopPullDownRefresh();
};
}
onMounted(() => {
fetchNotice();
fetchExemption();
});
onPullDownRefresh(() => {
currentPage.value = 1;
hasMore.value = true;
currentPage_exemption.value = 1;
hasMore_exemption.value = true;
fetchNotice();
fetchExemption();
})
onReachBottom(() => {
if(hasMore.value) {
currentPage.value++;
fetchNotice();
}
if(hasMore_exemption.value) {
currentPage_exemption.value++;
fetchExemption();
}
})