VUE使用keep-alive之后數據無法實時更新問題

問題描述：

根據需求實現在列表頁點擊“編輯”進行修改某項數據，修改完成返回之后，依舊保留在原位置，保留之前的查找條件和之前的數據，使用vue中的<keep-alive>之后，返回列表頁時不刷新頁面，依舊保持之前的數據，無法展示修改之后的最新消息。

解決辦法：

借用組件內的守衛beforeRouterEnter(){}方法，

beforeRouteEnter(to,from,next){
  
},
每次進入之后取到編輯之后的最新數據，然后把現有的列表中對應的數據進行修改，修改之后進行強制刷新，這樣就可以實現需要的效果了。

　beforeRouteEnter 守衛 不能 訪問 this，因為守衛在導航確認前被調用,因此即將登場的新組件還沒被創建。

　不過，你可以通過傳一個回調給 next來訪問組件實例。在導航被確認的時候執行回調，並且把組件實例作為回調方法的參數。　

beforeRouteEnter (to, from, next) { next(vm => { // 通過 `vm` 訪問組件實例 }) }

注意 beforeRouteEnter 是支持給 next 傳遞回調的唯一守衛。對於 beforeRouteUpdate 和 beforeRouteLeave 來說，this 已經可用了，所以不支持傳遞回調，因為沒有必要了。