項目要求(商品列表):pageA -> pageB -> pageAvue
但上面不少時候,因頁面需求緣由,不能使用這種實現方式,在網上找了不少方法,可是都不是很好用,如今本身實現了一個還算不錯的。vue-router
首先,在vue-router中,scrollBehavior
這個方法是能夠打印訪問過的頁面,滾動的位置的。【注意:在刷新頁面時,不會觸發該事件】vuex
咱們能夠使用vuex儲存滾動的位置(因頁面會作接口請求數據,因此要在數據渲染完成後,再進行跳轉)api
store.commit('SET_ROUTER_POSITION', savedPosition || {})
好。咱們獲取到滾動的位置而且儲存後,咱們在須要在指定頁面進行頁面渲染後,調用滾動事件。緩存
封裝mixin方法,省得每一個頁面都須要寫一次安全
再封裝頁面滾動事件,延時300毫秒是爲了安全起見,怕移動端有兼容,因此先加上網絡
最後,頁面進行調用spa
可在接口請求回來數據後,進行調用。這樣處理網絡過慢問題code
完成解決這麼久以來的困惑,若有幫助加個收藏router