解決多級頁面前進刷新后退不刷新問題(vue)

??最近在項目中遇到這樣一個需求:
??有三個頁面:a->b->c,a頁面點擊鏈接前進到b頁面,b頁面點擊鏈接前進到 c頁面,從c頁面按瀏覽器的后退鍵,可以c->b->a依次返回。要求前進的時候頁面刷新,后退時頁面不刷新(不發(fā)請求,頁面內(nèi)容不變,滾動條位置也不變)
??一開始嘗試用vue里的keep-alive解決,但沒成功。網(wǎng)上大部分的解決方案是用keep-alive配合router-view,keep-alive適合a->b,b->a這種二級頁面的返回,但三級及以上就不合適了,寫起來會很麻煩而且不通用。
??經(jīng)過幾天的查資料,最終找到了解決辦法:使用vue-navigation插件?;A用法:

npm i -S vue-navigation

main.js:

import Vue from 'vue'
import router from './router' // vue-router instance
import Navigation from 'vue-navigation'

Vue.use(Navigation, {router})

App.vue

<template>
  <navigation>
    <router-view></router-view>
  </navigation>
</template>

這些基本就夠用了,想了解更多請看原文檔:https://github.com/zack24q/vue-navigation
??感謝vue-navigation的作者zack24q,@zack24q
??感謝https://cnodejs.org/topic/5981617528607f916122dba8此貼作者,感謝16樓的回答。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

友情鏈接更多精彩內(nèi)容