vue+element-ui跳转详情页面列表页原来滚动的位置

1.需求要求pc端el项目从性情页面返回列表页面固定到原来跳转前滚动的位置
2.vue要使用keep-alive+activated结合使用
3.现在router.js中配置router要把keepAlive置为true
如图

4.在App.vue页面中写

5.在要用到的index.vue页面中写

6.使用activated()中获取位置

//获取当前记录的位置
  // 当组件在  内被切换，它的 activated 和 deactivated 这两个生命周期钩子函数将会被对应执行。
  activated() {
    this.$refs.basiclevelList.scrollTop = +localStorage.getItem("scrollTop");
  },

7.在mounted()中记录滚动的位置

this.$refs.basiclevelList.onscroll = function (e) {
      // 记录滚动位置
      // console.log('scroll', e.target.scrollTop)
      localStorage.setItem("scrollTop", e.target.scrollTop);
  };

8.最重要的不要忘记css中的样式，因为页面会自动滚动，所以很容易忽略样式

.basiclevel {
  overflow-x: scroll;
 }

9.这样就可以使用啦。