scrollId滚动定位

页面埋点 :id=”${scrollId}scroll${o+4}

4表示起点页面

 <el-row class="bt-main-btn__bzfx">
            <el-col v-for="(item, o) of resourceType.data" :key="o" :span="6">
              <el-button type="primary" plain @click="handleToPlociyBz(item)" :id="`${scrollId}scroll${o+4}`">
                {{
                item.name
                }}
              </el-button>
            </el-col>
          </el-row>

数据添加属性

data() {
    return {
      scrollId: "",
   }
}

初始化唯一标识

  created() {
    //===========公共部分  start
    this.scrollId = this.$crypto.md5(this.$route.fullPath);
    method.init(this);
    //===========公共部分 end
  },

路由执行后守卫（代码刨析）

// eslint-disable-next-line no-unused-vars
export function afterEach(to, from, store, md5) {
  try {
    let key = md5(to.fullPath);
    let y = (store.getters.bsScroll || {})[key];
    let screenHeight = store.getters.screenHeight;
    if (y && screenHeight) {
      // let pay/geI = (parseInt((y+screenHeight-250*2) / 250)+5);

      let pageI = parseInt(y / ((screenHeight - 350) / 2)) + 3;
      // console.log(pageI);
      // console.log(screenHeight - 350);
      // console.log((screenHeight - 350) / 2);
      // screenHeight- 250*2
      setTimeout(() => {
        let scrollObj = document.getElementById(`${key}scroll${pageI}`)
        if (scrollObj) {
          document.getElementById(`${key}scroll${pageI}`).scrollIntoView();
        }
      }, 500);
    }
  } catch (e) {
    alert("afterEach" + e);
  }
}