<template><div class="group-container" v-infinite-scroll="getActiveByAxios" infinite-scroll-disabled="busy" infinite-scroll-distance="10"></div><load-more tip="正在加載" v-if="showLoading"></load-more> </template><script>import Vue from 'vue'import Axios from 'axios'import { LoadMore } from 'vux'import infiniteScroll from 'vue-infinite-scroll'Vue.use(infiniteScroll);export default{data(){return {showLoading:true,busy: false,pageInfo:{count:0,pageIndex:1,pageSize:5},}},methods:{getActiveByAxios(){if((that.pageInfo.pageIndex - 1) * that.pageInfo.pageSize > that.pageInfo.count){that.busy = false;that.showLoading = false;return;}Axios.get('url',{params:{pageSize:that.pageInfo.pageSize,pageNum:that.pageInfo.pageIndex}}).then(function (response) {if (response.data.success){let list = response.data.data.commentList;that.comments = that.comments.concat(list);that.pageInfo.count = response.data.data.page.count;that.pageInfo.pageIndex += 1;setTimeout(() => {that.busy = false;}, 10);}}).catch(function (error) {})}}}</script>

總結

以上是生活随笔為你收集整理的基于vuejs的移动端分页代码的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。