如果呈现了该提醒谬误,浏览器后退后退按钮都不可用了,必须要点击刷新按钮页面能力失常加载
如图所示:
通过查看 vue-router 文档有一个 router.onError 的回调函数:原理就是在监听到路由报错信息后主动进行页面刷新,获取最新的代码。
具体方法在 router 目录下的 index.js 文件中增加代码如下:
router.onError((error) => {const pattern = /Loading chunk (\d)+ failed/g
const isChunkLoadFailed = error.message.match(pattern)
const targetPath = router.history.pending.fullPath
if (isChunkLoadFailed) {router.replace(targetPath)
}
})