Element UI 分页组件：点击切换分页并保留数据

要实现点击切换分页时，保留上一页页面中填入的数据，可以使用以下步骤：

1. 在每个分页组件中，使用 v-model 绑定一个数据，用于保存填入的数据。
2. 绑定一个点击事件，当点击切换分页时，触发事件处理函数。
3. 在事件处理函数中，将当前页的填入数据保存到一个临时变量中。
4. 切换分页时，将上一页的填入数据从临时变量中取出并赋值给上一页的 v-model 绑定的数据。
5. 这样就能保留上一页页面中填入的数据了。

示例代码如下所示：

<template>
  <div>
    <!-- 上一页内容 -->
    <input v-model='prevPageData' type='text' />

    <!-- 分页组件 -->
    <el-pagination
      :current-page='currentPage'
      :page-size='pageSize'
      :total='total'
      @current-change='handlePageChange'
    ></el-pagination>
    
    <!-- 下一页内容 -->
    <input v-model='nextPageData' type='text' />
  </div>
</template>

<script>
  export default {
    data() {
      return {
        currentPage: 1,
        pageSize: 10,
        total: 100,
        prevPageData: '',
        nextPageData: '',
      };
    },
    methods: {
      handlePageChange(newPage) {
        // 保存上一页填入的数据
        this.prevPageData = this.nextPageData;

        // 切换分页
        this.currentPage = newPage;

        // 将上一页的填入数据赋值给当前页
        this.nextPageData = this.prevPageData;
      },
    },
  };
</script>

在上述示例代码中，prevPageData 保存上一页填入的数据，nextPageData 保存下一页填入的数据。在 handlePageChange 方法中，先将上一页填入的数据保存到 prevPageData 中，然后再将 prevPageData 的值赋值给 nextPageData，这样就能保留上一页页面中填入的数据了。