vue+element-ui的项目使用分页器，跳转后再返回时高亮问题

1.页面所需相关操作如下：

第一步：如下是班级管理模块的页面，跳转到班级管理的详情页面

 第二步: 再从班级管理详情页面返回到班级管理页面时，班级管理页面应该显示的是原先所选择的第5页

第三步：其它页面点击跳转到该页面（如班级管理页面）时，应该为第一页（显示初始数据）

2.代码

初始列表页面（班级管理）页面代码：

//html

     <el-pagination
        @current-change="handleCurrentChange" 
        :current-page.sync="pageCount"
        :page-size="pageSize"  
        layout="total, prev, pager, next, jumper"
        :total="Alltotal"    
        background
        v-if="Alltotal!=0"   //总数不为0
      ></el-pagination>

//js

data() {
    return {
      
      pageSize: 15, //每页大小，默认15条记录,每页显示条目个数
      pageCount: 1, //当前页数
      Alltotal: 0, //总数量
      tableData: [] 
    };
  },
 created() {
     
    this.pageCount = Number(localStorage.getItem("pageCount")) || 1;
    this.getlistData();//获取列表数据方法
  },
  mounted() {
    this.pageCount = Number(localStorage.getItem("pageCount")) || 1;
    this.handleCurrentChange(this.pageCount);
  },

  beforeUpdate() {
    localStorage.setItem("pageCount", this.pageCount);
  },

  beforeDestroy() {
    localStorage.setItem("pageCount", 1);
  },

 在这里基本已经实现了上述所需操作了，但是我们还要当别的侧边栏页面（或者其它页面）点击进入该页面时是显示初始数据，即所选择的分页器为1，而不是先前选择的5.

 

第三步骤实现方法：

在点击进入详情页面时，在详情页面销毁掉原先保存的pageCount（当前页数）

在详情页面（班级管理详情页面）加上下面代码即可：

 beforeUpdate () {   
        localStorage.setItem('pageCount', this.$route.query.pageCount)
    },

 好了，所需功能完成，希望对大家有所帮助~