Element-ui分頁組件查詢時不觸發current-change

先操做element分頁，切換到第二頁，而後操做。

從代碼中強制將current-page強制設置爲1

（即從新查詢數據，並將當前頁重置爲第1頁）此時畫面顯示是對的，

分頁組件已經將第1頁的頁碼數字激活了而後點擊第2頁數字，進行換頁畫面顯示也是對的，第2頁數字變成激活狀態，

可是此時居然沒法觸發current-change事件

緣由

使用this.pagination.currentPage = val，強制改變分頁頁數以及樣式，無法徹底重置分頁組件

解決方案

data裏面初始化paginationShow爲true

 

<el-pagination v-if="paginationShow"

@current-change="handleCurrentChange"

:current-page.sync="pagination.currentPage"

:page-size="pagination.size"

layout="total, prev, pager, next, jumper"

:total="pagination.total">

</el-pagination>

 

而後使用v-if強制刷新組件便可，組件聲明改爲

 

search () {

this.paginationShow = false

this.handleCurrentChange(1)

this.$nextTick(function () {

this.paginationShow = true;

})

},

paginationShow = true，從新顯示分頁，必須放到$nextTick，畫面刷新完畢後，否則無效果

 

handleCurrentChange(val) {

let _this = this;

_this.pagination.currentPage = val;

}

原文轉自：https://blog.csdn.net/baidu_38305286/article/details/80054002