溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
項目中常見的分頁顯示，第二頁從1開始編號，然后在切換分頁的過程中，偶現不對，都是小問題，整理記錄一下，供參考。
template：
... <el-table-column type="index" label="編號" :index="getIndex" width="80px"> </el-table-column> ... <Pagination :total="total" :pageSize="pageSize" :currentPage="currentPage" @sizeChange="sizeChange" @currentChange="currentChange"> </Pagination>
script：
getIndex (index) {
if (this.currentPage==0){
return (this.currentPage) * this.pageSize + index + 1
} else{
return (this.currentPage-1) * this.pageSize + index + 1
}
},
由于后端第一頁是從0開始的，而前端是從第一頁開始，所以需要在當前頁減1。關于分頁，本頁條數
sizeChange(val){
let that = this;
that.currentPage = 1;
that.pageSize = val;
that.getPageInfo(that.currentPage, val);
},
跳轉頁面
currentChange(val){
let that = this;
that.currentPage = val;
that.getPageInfo(val, that.pageSize);
},
頁面加載數據
getUserList(currentPage, pageSize){
let that = this;
that.$axios({
method: 'get',
url: '***',
params: {
currentPage: (currentPage || that.currentPage || 1)-1,
pageSize: pageSize || that.pageSize || 10
},
needInterceptors: true,
showError: true,
loader: true
}).then(function(result){
let data = result && result.data || [];
let page = result && result.pageCont || {};
that.total = page.totalItems || 0;
that.tableData = data;
})
},
試了幾次，這樣寫應該是沒有問題的，也解決了后端傳0開始的問題。
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
