1. 缓存产生的原因
vue-router 为了性能考虑 如果路径不变 对应的组件也不会重新渲染
2. 导致的问题
组件不渲染 生命周期钩子函数也就不执行 依赖钩子函数发送网络请求的逻辑就无法执行
新数据无法获取
3. 解决思路
根据思路:
1. 组件的生命周期钩子函数重新执行
2. 把发送网络请求的函数重新执行
方案:
1. key 二级路由 router-view :key="$route.fullPath"
2. onBeforeRouteUpdate 每次路由更新都会重新执行
onBeforeRouteUpdate((to)=>{
loadData(to.params.id)
})
如何选择?
1. 大多数情况 都选择key
2. 如果性能要求比较高 选择第二种方案
性能问题
加上key 组件重新渲染 组件会进行一个从无到有的过程 (耗费的资源多)
onBeforeRouteUpdate 路由更新之后 只会执行自己的回调函数