在項目中出現的情況是路由變化後，url變化了，但是頁面沒有刷新，手動刷新一下才出現應有的畫面。
情況一：
在 github 的 vue-router 中找到同樣的一個問題：3.0.1版本通過router實例無法跳轉
昨天發現有些路由不能正常跳轉，找了一下發現都是那些實例化後使用 router.push 而不是直接使用 this.$router.push 的地方。
注意：
1.this.$router.go(val) => 在history記錄中前進或者後退val步，當val爲0時刷新當前頁面。2.this.$router.push(path) => 在history棧中添加一條新的記錄。
出現的情況是 router.push 後，url變化了，但是頁面沒有刷新，手動刷新一下才出現應有的畫面。
我看了一下 package.json，我的 vue 和 axios 是沒有寫版本號，但 vue-router 明明寫了版本號，怎麼可能以前行的，現在就不行了呢？
然後，我使用 npm view vue-router 查看後才發現使用的已經不是 package.json 中的版本了，於是斷定也許是我前幾天 npm update 了！
( 以後不要隨便 update 了! )
具體爲什麼新版本不行了，我也不太清楚。
最簡單的解決辦法當然是直接把 router.push 改成 this.$router.push
但是，如果這樣可以的話，我當初爲什麼要在組件內再實例化一個 Router 呢？
顯然是因爲有些地方的 this 並不是 vue,那麼，再實例化一個 vue，然後使用 vue.$router 行嗎？
答案當然是不行的，因爲這個 vue 與 其它地方的 vue 應該又不是同一個對象了。
那麼，終極的解決方案就是：
把全局的 vue 中的 router 加到 window 中，也就在 main.js 中使用：
window.router=router
然後其它任何地方就可以直接愉快地使用 router.push 等 router 的方法了。
當然你也可以使用監聽路由變化，代碼：
watch: {
'$route' (to, from) {
console.log(this.getStatus(this.$route.path))
}
或者
'$route' : "getdata" //路由變化觸發下列方法
},
分析原因：
實例後的 router 不能刷新頁面，應該是因爲它與全局的vue中的 this.$router 的不是同一個，而之前的版本中能直接這樣使用，應該是使用了單例。
情況二：
在使用緩存組件後發現頁面數據不刷新。
<template>
<div id="app">
<keep-alive>
<router-view></router-view>
</keep-alive>
</div>
</template>
問題原因：在組件mounted鉤子中調用的刷新頁面內容，但測試發現這個鉤子沒有被調用。後來發現App.vue中使用了 < keep-alive > ：
keep-alive是Vue的內置組件，能在組件切換過程中將狀態保留在內存中，防止重複渲染DOM。這就是問題所在了。
解決辦法：
使用Vue組件切換過程鉤子activated(keep-alive組件激活時調用)，而不是掛載鉤子mounted：
created()：在創建vue對象時，當html渲染之前就觸發；但是注意，全局vue.js不強制刷新或者重啓時只創建一次，也就是說，created()只會觸發一次；
activated()：在vue對象存活的情況下，進入當前存在activated()函數的頁面時，一進入頁面就觸發；可用於初始化頁面數據等
<script>
export default {
// ...
activated: function() {
}
}
</script>
其他可參考https://blog.csdn.net/w390058785/article/details/82813032