页面缓存无效，openKeepAlive: true

[marina-xiaomi]

⚠️ 重要 ⚠️ 在进一步操作之前，请检查下列选项。如果您忽视此模板或者没有提供关键信息，您的 Issue 将直接被关闭

• [ ] 已阅读 文档.
• [ ] 确保您的代码已是最新或者所报告的 Bug 在最新版本中可以重现. (部分 Bug 可能已经在最近的代码中修复)
• [ ] 已在 Issues 中搜索了相关的关键词
• [ ] 不是 ant design vue 组件库的 Bug

描述 Bug

const setting: ProjectConfig = { // Whether to show the configuration button showSettingButton: false,

// Whether to show the theme switch button showDarkModeToggle: false,

// Settings button position settingButtonPosition: SettingButtonPositionEnum.AUTO,

// Permission mode permissionMode: PermissionModeEnum.ROUTE_MAPPING,

// Permission-related cache is stored in sessionStorage or localStorage permissionCacheType: CacheTypeEnum.LOCAL,

// Session timeout processing sessionTimeoutProcessing: SessionTimeoutProcessingEnum.ROUTE_JUMP,

// color themeColor: primaryColor,

// Website gray mode, open for possible mourning dates grayMode: false,

// Color Weakness Mode colorWeak: false,

// Whether to cancel the menu, the top, the multi-tab page display, for possible embedded in other systems fullContent: false,

// content mode contentMode: ContentEnum.FULL,

// Whether to display the logo showLogo: true,

// Whether to show footer showFooter: false,

// Header configuration headerSetting: { // header bg color bgColor: HEADER_PRESET_BG_COLOR_LIST[0], // Fixed at the top fixed: true, // Whether to show top show: true, // theme theme: ThemeEnum.LIGHT, // Whether to enable the lock screen function useLockPage: false, // Whether to show the full screen button showFullScreen: false, // Whether to show the document button showDoc: false, // Whether to show the notification button showNotice: false, // Whether to display the menu search showSearch: false, },

// Menu configuration menuSetting: { // sidebar menu bg color bgColor: SIDE_BAR_BG_COLOR_LIST[0], // Whether to fix the left menu fixed: true, // Menu collapse collapsed: false, // Whether to display the menu name when folding the menu collapsedShowTitle: false, // Whether it can be dragged // Only limited to the opening of the left menu, the mouse has a drag bar on the right side of the menu canDrag: false, // Whether to show no dom show: true, // Whether to show dom hidden: false, // Menu width menuWidth: 210, // Menu mode mode: MenuModeEnum.INLINE, // Menu type type: MenuTypeEnum.SIDEBAR, // Menu theme theme: ThemeEnum.DARK, // Split menu split: false, // Top menu layout topMenuAlign: 'center', // Fold trigger position trigger: TriggerEnum.HEADER, // Turn on accordion mode, only show a menu accordion: true, // Switch page to close menu closeMixSidebarOnChange: false, // Module opening method ‘click’ |'hover' mixSideTrigger: MixSidebarTriggerEnum.CLICK, // Fixed expanded menu mixSideFixed: false, },

// Multi-label multiTabsSetting: { cache: true, // Turn on show: true, // Is it possible to drag and drop sorting tabs canDrag: true, // Turn on quick actions showQuick: true, // Whether to show the refresh button showRedo: false, // Whether to show the collapse button showFold: true, },

// Transition Setting transitionSetting: { // Whether to open the page switching animation // The disabled state will also disable pageLoading enable: true,

// Route basic switching animation
basicTransition: RouterTransitionEnum.FADE_SIDE,

// Whether to open page switching loading
// Only open when enable=true
openPageLoading: true,

// Whether to open the top progress bar
openNProgress: false,

},

// Whether to enable KeepAlive cache is best to close during development, otherwise the cache needs to be cleared every time openKeepAlive: true,

// Automatic screen lock time, 0 does not lock the screen. Unit minute default 0 lockTime: 0,

// Whether to show breadcrumbs showBreadCrumb: true,

// Whether to show the breadcrumb icon showBreadCrumbIcon: false,

// Use error-handler-plugin useErrorHandle: false,

// Whether to open back to top useOpenBackTop: true,

// Is it possible to embed iframe pages canEmbedIFramePage: true,

// Whether to delete unclosed messages and notify when switching the interface closeMessageOnSwitch: true,

// Whether to cancel the http request that has been sent but not responded when switching the interface. // If it is enabled, I want to overwrite a single interface. Can be set in a separate interface removeAllHttpPending: false, }; { path: '/pagemange', name: 'Pagemange', component: LAYOUT, meta: { orderNo: 0, icon: 'ion:layers-outline', title: t('routes.pagemange.Pagemange'), }, children: [ { path: 'tabs', name: 'tabsManage', component: () => import('/@/views/pagemange/tabs.vue'), meta: { title: t('routes.pagemange.tabs'), keepAlive: true, ignoreKeepAlive: false, }, }, ] }

[IFnGSiYu]

页面中添加name属性

export default {
   name:'xxx'
}

[marina-xiaomi]

页面中添加name属性

export default {
   name:'xxx'
}

已经有了啊

[xiaojieajie]

确认下是否是新版本，我是有效的 可以用vue-devtools 浏览器插件看看

[marina-xiaomi]

确认下是否是新版本，我是有效的 可以用vue-devtools 浏览器插件看看

你是什么版本的啊

[hewei33]

我也遇到这个问题，vue-devtools插件也查看确实被keep包裹

[Pluto1219]

开启缓存有 3 个条件

在 src/settings/projectSetting.ts 内将openKeepAlive 设置为 true 路由设置 name，且不能重复 路由对应的组件加上 name，与路由设置的 name 保持一致

我也满足了这三个条件，vue-devtools查看，也是被KeepAlive包裹着，为什么不生效呢

[xiaojieajie]

确认下是否是新版本，我是有效的 可以用vue-devtools 浏览器插件看看

你是什么版本的啊

最新版本

[xiaojieajie]

@Pluto1219 @hewei33 @marina-xiaomi 你们看下这里哈，这里也要是true才行

[Pluto1219]

@Pluto1219 @hewei33 @marina-xiaomi 你们看下这里哈，这里也要是true才行

这个默认是开启的，我Debug对比下两个项目的Permission.ts看看

[xiaojieajie]

@Pluto1219 @hewei33 @marina-xiaomi 你们看下这里哈，这里也要是true才行

这个默认是开启的，我Debug对比下两个项目的Permission.ts看看

打印出keepAlive 的 include 参数看看哈，问题应该就是出在这里

[chenhw]

最近同样出现了这个问题，以前是好的，可能和最近某个更新有关或者npm包的哪个更新

[chenhw]

我也遇到这个问题，vue-devtools插件也查看确实被keep包裹

是的，相同的问题，但是是最新新出现的

[xiaojieajie]

我也遇到这个问题，vue-devtools插件也查看确实被keep包裹

是的，相同的问题，但是是最新新出现的

我也是最新版本的呀，你打印出include 看看

[chenhw]

我也遇到这个问题，vue-devtools插件也查看确实被keep包裹

是的，相同的问题，但是是最新新出现的

我也是最新版本的呀，你打印出include 看看

是由于#2052 导致的

[xiaojieajie]

我也遇到这个问题，vue-devtools插件也查看确实被keep包裹

是的，相同的问题，但是是最新新出现的

我也是最新版本的呀，你打印出include 看看

是由于#2052 导致的

哪段代码呢

[chenhw]

我也遇到这个问题，vue-devtools插件也查看确实被keep包裹

是的，相同的问题，但是是最新新出现的

我也是最新版本的呀，你打印出include 看看

是由于#2052 导致的

哪段代码呢 <keep-alive v-if="openCache" :include="getCaches"> <div :key="route.name"> <component :is="Component" :key="route.fullPath" /> </div> </keep-alive> <div v-else :key="route.name"> <component :is="Component" :key="route.fullPath" /> </div>

[wangmin0314]

解决了吗？

[xiaojieajie]

我也遇到这个问题，vue-devtools插件也查看确实被keep包裹

是的，相同的问题，但是是最新新出现的

我也是最新版本的呀，你打印出include 看看

是由于#2052 导致的

哪段代码呢 <keep-alive v-if="openCache" :include="getCaches"> <div :key="route.name"> <component :is="Component" :key="route.fullPath" /> </div> </keep-alive> <div v-else :key="route.name"> <component :is="Component" :key="route.fullPath" /> </div>

没看出这段代码 影响的点在哪里

[xiaojieajie]

我也遇到这个问题，vue-devtools插件也查看确实被keep包裹

是的，相同的问题，但是是最新新出现的

我也是最新版本的呀，你打印出include 看看

是由于#2052 导致的

哪段代码呢 <keep-alive v-if="openCache" :include="getCaches"> <div :key="route.name"> <component :is="Component" :key="route.fullPath" /> </div> </keep-alive> <div v-else :key="route.name"> <component :is="Component" :key="route.fullPath" /> </div>

确实是，我提个pr解决一下

[xiaojieajie]

#2101

[wuxinlai]

如果你是多级路由, 每一个 router-view 内部都是需要 keep-alive 包裹, keep-alive 内部不能有任何判断条件。，将layouts/page/index.vue中的transition修改成以下方式，可以运行。

<keep-alive v-if="openCache" :include="getCaches">
          <component :is="Component" :key="route.fullPath" />
        </keep-alive>
        <component v-else :is="Component" :key="route.fullPath" />

[czcz1024]

写两个script，name生效，用vite-plugin-vue-setup-extend插件在<script setup name='...' 不生效

[yin2017168]

在项目路径 build/vite/plugin/index.ts 引入 import vueSetupExtend from 'vite-plugin-vue-setup-extend';