【vue】记一次 keep-alive失效

最新推荐文章于 2024-07-11 15:08:06 发布

m0_46667956

最新推荐文章于 2024-07-11 15:08:06 发布

阅读量215

点赞数

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/m0_46667956/article/details/125058509

版权

本文记录了一次在Vue应用中遇到keep-alive失效的问题及解决方案。当切换tab时，页面每次都重新加载，导致用户体验下降。经过排查，发现问题在于路由配置中的component应使用require而不是import，并且路由名称需与组件名称保持一致，大小写敏感。修复这个问题后，成功实现了页面切换时不重新加载的效果，提高了应用的流畅性。

摘要由CSDN通过智能技术生成

出现问题

在这里插入图片描述
切换tab时，每次切换都会重新加载页面。
频繁操作时，使用起来就很难受

解决问题

路由：

{
        path: 'ProductInfoDetail',
        component: (resolve) => require(['@/views/modules/proBuildScheduleForNew/proBuildScheduleForNew/productInfoDetail/index'], resolve),
        name: 'ProductInfoDetail'
}

组件名称：