vue所有頁面前進(jìn)請求數(shù)據(jù)后退不請求數(shù)據(jù)保持之前瀏覽狀態(tài)包括滑動(dòng)位置等

watch 監(jiān)聽$route 這個(gè)思路能解決你的需求嘛

怎么判斷是后退到該頁面還是點(diǎn)擊菜單到該頁面，還是說只要非首次進(jìn)入就不刷新

我keep-alive都用了好幾個(gè)項(xiàng)目了 也沒出現(xiàn)啥 bug啊。。。。

我覺得項(xiàng)目用keep-alive 的話 要注意幾個(gè)問題把

1. 頁面狀態(tài)的重置，特別是表單
2. 之前發(fā)現(xiàn)一個(gè)問題 三級(jí)路由的時(shí)候，從這個(gè)模塊的第三級(jí)push到另一個(gè)模塊的第三級(jí) 頁面html竟然沒變，發(fā)現(xiàn)是keep-alive的原因，我是整個(gè)項(xiàng)目keep-alive的，具體表現(xiàn)可以看我在github的提問：

https://github.com/vuejs/vue-...
我的解決方案是路由只是用2級(jí)，但是為了url看起來比較好看，url表現(xiàn)出來的是三級(jí)

優(yōu)點(diǎn)的話 就是能保存頁面狀態(tài)，就我的項(xiàng)目而言
像是一些首頁啊、分類頁面啊、個(gè)人中心頁面等等 這種只用請求一個(gè)次的頁面 請求事件放在created里面就行

關(guān)于樓主說的列表到詳情，我一般的做法是把請求函數(shù)放在beforeRouteEnter里面，
然后根據(jù)條件判斷是否要重新加載第一頁：
!list.length || from.name != 'xxxx'
(因?yàn)槲业捻?xiàng)目跑在微信瀏覽器里 所以做list判斷是為了解決，如果用戶在詳情頁刷新頁面，然后返回到列表頁，列表頁是空的情況)

關(guān)于保存頁面滾動(dòng)位置，我遇到兩種情況：

1. 我的列表頁面使用的是better-scroll， 我從詳情頁返回到列表頁 列表的移動(dòng)位置是自動(dòng)保留的，所以不需要做特殊處理
2. 列表頁不需要分頁，所以用的是overflow-y:auto，這個(gè)是沒有保留滾動(dòng)狀態(tài)的，所以我的做法是：

vue部分：

beforeRouteEnter(to, from, next) {
  next(vm => {
    if (!vm.hasLoadData) {
      vm.getList()
    }

    if (vm.scrollTop && vm.$refs.scrollBody) {
      vm.$refs.scrollBody.scrollTop = vm.scrollTop        //    設(shè)置滾動(dòng)位置
    }
  })
},
beforeRouteLeave(to, from, next) {
  this.scrollTop = this.$refs.scrollBody.scrollTop        //    保存滾動(dòng)位置
  next()
},
data() {
  return {
    scrollTop: 0,   //  頁面滾動(dòng)條位置
  }
},

html：

...
<div ref="scrollBody"><!--這個(gè)是滾動(dòng)容器 height: 100vh; overflow-y: auto; -->
    這里是列表內(nèi)容
</div>
...

以上，如果有啥問題，大家多討論討論

把你需要保存的信息保存到localstorage里，頁面加載的時(shí)候取一下看看有沒有，有的話就用localstorage里的