鍍金池/ 問答/HTML/ element Ui 分頁(yè)size-change事件觸發(fā)同時(shí)也出發(fā)了curren

element Ui 分頁(yè)size-change事件觸發(fā)同時(shí)也出發(fā)了current-change事件，導(dǎo)致調(diào)用兩次接口

element Ui 分頁(yè)size-change事件觸發(fā)同時(shí)也出發(fā)了current-change事件，導(dǎo)致調(diào)用兩次接口

<el-pagination 
  @size-change="handleSizeChange"
  @current-change="handleCurrentChange" 
  :current-page.sync="pageInfo.PageNum" 
  :page-sizes="[5, 10, 20]"
  :page-size="pageInfo.PageSize" 
   layout="total, sizes, prev, pager, next, jumper" :total="pageInfo.Total">
</el-pagination> 
    //pageSize變化事件
   handleSizeChange(val) {
        this.$emit("sizeChange", val);
  },

  //pageNum變化事件
  handleCurrentChange() {
    this.$emit("pageNumCheng");
  }
回答
編輯回答
離人歸

這個(gè)地方確實(shí)有點(diǎn)問題，因?yàn)橐话鉺ize改變的時(shí)候會(huì)有兩種情況：頁(yè)數(shù)變了和沒變兩種。所以有時(shí)候會(huì)觸發(fā)，有時(shí)候又不會(huì)觸發(fā)。所以我的建議是size改變的時(shí)候請(qǐng)求接口，同時(shí)設(shè)置一個(gè)flag，如果是size改變的情況，curent-change事件不觸發(fā)請(qǐng)求接口，等到size請(qǐng)求的接口回來以后再設(shè)置這個(gè)flag取反

2017年2月6日 17:31
編輯回答
法克魷
handleSizeChange(val) {
                this.options.limit = val;
                this.getData();
},
            handleCurrentChange(val) {
                this.options.offset = this.options.limit * (val - 1);
                this.getData();
            }
2018年5月16日 03:01