Element分页遇到的坑

当有搜索功能和分页的情况，遇到了以下问题：

第一个问题：
当数据渲染完第一次点击第2页或者第三页…输入搜索内容并点击搜索按钮，得到搜索结果之后分页高亮是在上一次点击的页数上，但数据显示的是第一页的，解决方法：

//   :current-page.sync = "pageNo"

searchRequest(e) {
    this.status = 1    // 判断用户是否点击了搜索按钮会回车键
    this.Shop_shopWorkers(1, this.searchWorkers);
    this.pageNo = 1   // 点击搜索按钮时给页数赋值为1
}

第二个问题：
数据渲染完之后没有点分页直接输入搜索内容并点击搜索，得到搜索结果时点击分页，数据就会回到初始页面，原因是因为没有将一个参数传给后端导致数据重新渲染，我在点击分页的时候将参数传过去，分页就正常了，但又出现了一个问题。

shopPageChange(val) {
    this.Shop_shopStores(val, this.searchShops)
}

第三个问题：当我输入搜索内容，但并未触发搜索按钮去点击分页，会导点击分页变成搜索功能，这样虽然也没什么问题，但感觉给用户不好的体验。解决办法：在全局新建一个变量status ，在触发搜索按钮时给 this.status = 1

shopPageChange(val) {
    this.pageNo = val
      if (this.status == 1) {
        this.Shop_shopStores(val, this.searchShops)
      } else {
        this.Shop_shopStores(val)
      }
}

第四个问题：

<el-pagination
    background
    @size-change="handleSizeChange"
    @current-change="handleCurrentChange"
    :current-page="currentPage4"
    :page-size="10"
    layout="total, prev, pager, next, jumper"
    :total="totalCount"   //  total一定要在data里定义为0，不能用数组里的变量
 ></el-pagination>

之前写法是commodityList.totalCount，而且未在data里定义，导致第一次进页面分页是正常的，只要点击了页码，你点击的页码高亮样式会不见，虽然总数是对的！！！