Vue 查看詳情B的返回列表A的，列表A的高度怎么才能在剛剛點(diǎn)進(jìn)去的位置呢？

列表A是這樣的

我點(diǎn)擊下面的廠名，進(jìn)去B詳情

我現(xiàn)在從B詳情返回的時(shí)候默認(rèn)的高度是0

  router.afterEach((to, from, next) => {
    window.scrollTo(0,0);
   document.title = to.name;
});

所以的頁(yè)面點(diǎn)擊進(jìn)去的時(shí)候高度都為0，但是這個(gè)頁(yè)面從B詳情返回A列表的時(shí)候高度不能為0，高度要為剛剛進(jìn)去B詳情的文職，這個(gè)怎么實(shí)現(xiàn)呢？

回答

編輯回答

不討囍

存session，a的高度，回來(lái)的時(shí)候調(diào)用一下，滾動(dòng)到對(duì)應(yīng)高度

2017年1月24日 16:57

編輯回答

夏夕

看下這個(gè)文檔滾動(dòng)行為

2018年9月16日 16:50

編輯回答

默念

這個(gè)問(wèn)題已經(jīng)解了
用的是Vue的 scrollBehavior
官方api是

然而并沒(méi)有用，需要這樣

scrollBehavior (to, from, savedPosition) {
    console.log(savedPosition);
 if(savedPosition) {
    setTimeout(() => {
        window.scrollTo(savedPosition.x, savedPosition.y)
    }, 200)
}else {
      console.log("執(zhí)行了else")
    return { x: 0, y: 0 }
  }
}

我還用到了 keep-alive（緩存）來(lái)達(dá)到后退時(shí)不刷新數(shù)據(jù)，前進(jìn)時(shí)刷新數(shù)據(jù)的效果。

new VueRouter({
   mode: 'history',
    routes: [{
    path: '/foo',    
    component: (resolve) => {
        require(['views/foo'], resolve)
    },
    meta: {isKeepAlive: true}
}],
scrollBehavior (to, from, savedPosition) {
    if (savedPosition || typeof savedPosition == 'undefined') { //從第二頁(yè)返回首頁(yè)時(shí)savePosition為undefined
        //只處理設(shè)置了路由元信息的組件
        from.meta.isKeepAlive = typeof from.meta.isKeepAlive == 'undefined' ? undefined : false;
        to.meta.isKeepAlive = typeof to.meta.isKeepAlive == 'undefined' ? undefined : true;
        if(savedPosition) {
            return savedPosition;
        }
    } else {
        from.meta.isKeepAlive = typeof from.meta.isKeepAlive == 'undefined' ? undefined : true;
        to.meta.isKeepAlive = typeof to.meta.isKeepAlive == 'undefined' ? undefined : false;
    }
  }
 })

參考：https://segmentfault.com/q/10...

2017年2月10日 12:53