由於Vue會復用相同的組件， 將不在執行created, mounted之類的鈎子, 這時候就需要通過設置路由鈎子beforeRouteUpdate或者監聽$route的變化來執行相關方法更新數據。如果不想要復用組件，可以根據需要進行如下設置。
1.設置router-view 的key為$route.path
從/user/foo => /user/bar, 由於這兩個路由的$route.path並不一樣, 所以組件被強制不復用,組件會執行created與 mounted中的內容。
從/user?name=foo => /user?name=bar, 由於這兩個路由的$route.path一樣, 所以和沒設置 key 屬性一樣, 會復用組件。
2.設置router-view 的key為$route.fullPath
從/user/foo => /user/bar 或者 /user?name=foo => /user?name=bar , 由相應前后跳轉的兩個路由的$route.fullPath並不一樣, 所以組件被強制不復用。這也意味着組件的生命周期鈎子會再次被調用，created與 mounted中的內容會被執行。
<router-view>不設置key
首先，vue會復用相同組件，對於路由有多個子路由來說，當在子路由來回切換時，會導致頁面不刷新的問題，這是因為不再執行created和mounted這些鈎子函數，可以通過watch來監聽$route的變化從而加載不同的組件
<router-view :key="$route.path">
通過設置key值為$route.path,因為子路由的path不同，從而避免了組件復用，子路由間來回切換時，頁面都會重新加載.
遇到的問題
在后台系統中，點擊側導航菜單子菜單時，設置了:key="$route.path"會導致菜單關閉又打開，視覺效果不好，不設置key就實現組件復用，不會出現那個bug