1. 問題
做用戶中心的時候,用戶中心左側顯示用戶頭像和導航欄,點擊導航欄會切換子路由;
我在父路由組件created調用獲取用戶頭像接口,發現每次切換子路由都會調用該接口,也就是每次切換子路由,父路由都會重新渲染
2. 原因
home中:
<router-view :key="`${$route.path}${$route.query.keywords}`"></router-view>
也就是渲染父路由的容器。因為設置了key,所以改變路由時,只要key發生變化,對應路由就會重新渲染。
這里每次切換子路由,$route.path發生改變,引起key值改變,所以導致父路由重新渲染。
3. 解決辦法
將key去掉,但是我這邊是有些頁面是要根據$route.query.keywords改變重新渲染的,所以我改成了
<router-view :key="`${$route.query.keywords}`"></router-view>