const getList = async (pageEvent = 0, pageSize = 10) => { if (loading.value) return; loading.value = true; try { const res = await api.getDailyView({ pageSize, pageEvent, pageCallback: pageCallback.value, }); const currentPage = res.data.cardList || []; list.push(...currentPage); pageCallback.value = res.data.pageCallback; loading.value = false; emit('getHeight'); if (!res.data.hasNextPage) { onReachBottomFlag.value = true; } } catch (e) { loading.value = false; } };将h5中如何实现这个函数
时间: 2024-03-10 11:44:56 浏览: 89
Vue.js获取被选择的option的value和text值方法
这个函数是一个异步函数,它接受两个参数:pageEvent和pageSize。在函数内部,它会先判断loading的值是否为true,如果是,就直接返回,不执行后续代码。如果loading的值为false,则将loading的值设为true,表示正在加载。
接着,它会调用api.getDailyView方法,传入一个对象参数。这个对象参数包含pageSize、pageEvent和pageCallback等属性。其中pageCallback是一个ref对象,用于存储分页信息。getDailyView方法返回一个Promise对象,如果请求成功,就将获取到的数据添加到list数组中,并更新pageCallback的值。然后将loading的值设为false,并触发getHeight事件。如果获取到的数据没有下一页了,就将onReachBottomFlag的值设为true。
在调用这个函数之前,需要先导入api模块,并将list、loading、onReachBottomFlag和pageCallback等变量进行初始化。另外,需要使用Vue的emit方法来触发getHeight事件。例如,在Vue组件的created钩子函数中可以这样调用getList函数:
```
import api from 'api';
export default {
data() {
return {
list: [],
loading: false,
onReachBottomFlag: false,
pageCallback: ref(null),
};
},
created() {
this.getList();
},
methods: {
async getList(pageEvent = 0, pageSize = 10) {
// 函数体
},
getHeight() {
// 触发事件
this.$emit('getHeight');
},
},
};
```
阅读全文