vue中实现滚动条位置缓存

 mounted() {
    // 注册滚动事件
    window.addEventListener("scroll", this.handleScroll, true);
  },
  activated() {
/// 页面进入之后更新  滚动条的位置
    console.log(this.thisScrollTop + "上一次的位置");
    //this.$nextTick()异步执行dom刷新
    this.$nextTick(() => {
      $("#scroll").scrollTop(this.thisScrollTop);
    });
  },
  beforeRouteLeave(to, from, next) {
    this.thisScrollTop = $("#scroll").scrollTop();
    window.removeEventListener("scroll", this.handleScroll, true);
    if (to.path == "/Task") {
      clearKeepAlive(this); /// 清除缓存
    } else {
      // from.meta.keepAlive = true;
    }
    next();
  },

// 方法
handleScroll() {
/// 记录滚动条的位置
      this.thisScrollTop = document.getElementById("scroll").scrollTop; //滚动条所在位置
      // console.log(this.thisScrollTop + "当前的位置");
    },

清除缓存的方法封装

//清除keepAlive的缓存
export function clearKeepAlive(that){
  let vnode = that.$vnode
  let parentVnode = vnode.parent 
  if (parentVnode && parentVnode.componentInstance.cache) {
    var key = vnode.key == null
      ? vnode.componentOptions.Ctor.cid + (vnode.componentOptions.tag ? `::${vnode.componentOptions.tag}` : '')
      : vnode.key;
    var cache = parentVnode.componentInstance.cache;
    var keys  = parentVnode.componentInstance.keys;

    if (cache[key]) {
      that.$destroy()
      // remove key
      if (keys.length) {
        var index = keys.indexOf(key)
        if (index > -1) {
            keys.splice(index, 1)
        }
      }
      cache[key] = null
    }
  }
}