項(xiàng)目場景：element 分頁器

提示：這里簡述項(xiàng)目相關(guān)背景：

例如：項(xiàng)目場景：刪除某一頁的最后一條數(shù)據(jù)之后頁面不自動(dòng)跳到上一頁

解決方案：

<!-- 分頁組件 --><el-paginationstyle="margin-top: 30px;"background:page-size="ruleForm.currentPageSize":page-sizes="[10, 20, 30, 40]"layout="->,total,sizes, prev, pager, next, jumper":total="count":current-page.sync="ruleForm.currentPage"@size-change="sizeChangeHandle"@current-change="currentChangeHandle"></el-pagination> export default {data() {return {ruleForm: {currentPage: 1, // 當(dāng)前頁碼currentPageSize: 10, //每一頁顯示的條數(shù)},totalPage: 0, // 總頁數(shù)count: 0, // 數(shù)據(jù)總條數(shù)pagerCurrentPage: 1, // 分頁欄當(dāng)前頁碼};},created() {//第一次進(jìn)入頁面的數(shù)據(jù)請(qǐng)求this.fetchData();},methods: {fetchData() {//數(shù)據(jù)請(qǐng)求findBlog(this.ruleForm).then(r => {this.tableData = r.data.data.records;this.count = r.data.data.total;this.totalPage = Math.ceil(this.count / this.ruleForm.currentPageSize);// 下面的 if 會(huì)在刪除文章的時(shí)候可能會(huì)觸發(fā)，例如最后一頁只有一條數(shù)據(jù)// 刪除之后，總頁碼數(shù)就會(huì)減一，當(dāng)前頁碼數(shù)就大于了總頁碼數(shù)，所以要做處理if (this.ruleForm.currentPage > this.totalPage) {this.ruleForm.currentPage = this.totalPage;this.fetchData();}});},// 分頁相關(guān)事件sizeChangeHandle(pagerNum) {// console.log(this.ruleForm, "每頁條數(shù)");this.ruleForm.currentPageSize = parseInt(pagerNum);this.ruleForm.currentPage = 1;this.pagerCurrentPage = 1;this.fetchData();},currentChangeHandle(pageNum) {// console.log(this.ruleForm, "第幾頁");this.ruleForm.currentPage = parseInt(pageNum);this.fetchData();},}, }; </script>

總結(jié)

以上是生活随笔為你收集整理的vue element table列表删除某一页的最后一条数据之后页面不自动跳到上一页的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。