image/tdesign-vue-next-starter
1
0
Fork 1
mirror of https://github.com/Tencent/tdesign-vue-next-starter.git synced 2024-12-23 08:36:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: ignore cache demo (#155)

Browse Source 
* fix: tab routes cache fails

* feat: add ignore cache routes demo
This commit is contained in:
yuyang 2022-05-23 17:47:41 +08:00 committed by GitHub
parent b7f80c31cc
commit 3a2d29df6c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/layouts/index.tsx
View File

@ -169,7 +169,8 @@ export default defineComponent({
const { showBreadcrumb, showFooter, isUseTabsRouter } = settingStore; const { showBreadcrumb, showFooter, isUseTabsRouter } = settingStore;
const { tabRouters } = tabsRouterStore; const { tabRouters } = tabsRouterStore;
return ( return (
<t-layout class={[`${prefix}-layout`]} key={route.name}> // <t-layout class={[`${prefix}-layout`]} key={route.name}> 如果存在多个滚动列表之间切换时，页面不刷新导致的样式问题 请设置key 但会导致多标签tab页的缓存失效
<t-layout class={[`${prefix}-layout`]}>
{isUseTabsRouter && ( {isUseTabsRouter && (
<t-tabs <t-tabs
theme="card" theme="card"

7
src/store/modules/tabs-router.ts
View File

@ -8,6 +8,10 @@ const state = {
isRefreshing: false, isRefreshing: false,
}; };
// 不需要做多标签tabs页缓存的列表 值为每个页面对应的name 如 DashboardDetail
// const ignoreCacheRoutes = ['DashboardDetail'];
const ignoreCacheRoutes = [];
export const useTabsRouterStore = defineStore('tabsRouter', { export const useTabsRouterStore = defineStore('tabsRouter', {
state: () => state, state: () => state,
getters: { getters: {
@ -20,9 +24,10 @@ export const useTabsRouterStore = defineStore('tabsRouter', {
this.tabRouters[routeIdx].isAlive = !this.tabRouters[routeIdx].isAlive; this.tabRouters[routeIdx].isAlive = !this.tabRouters[routeIdx].isAlive;
}, },
appendTabRouterList(newRoute: TRouterInfo) { appendTabRouterList(newRoute: TRouterInfo) {
const needAlive = !ignoreCacheRoutes.includes(newRoute.name);
if (!this.tabRouters.find((route: TRouterInfo) => route.path === newRoute.path)) { if (!this.tabRouters.find((route: TRouterInfo) => route.path === newRoute.path)) {
// eslint-disable-next-line no-param-reassign // eslint-disable-next-line no-param-reassign
this.tabRouterList = this.tabRouterList.concat(newRoute); this.tabRouterList = this.tabRouterList.concat({ ...newRoute, isAlive: needAlive });
} }
}, },
subtractCurrentTabRouter(newRoute: TRouterInfo) { subtractCurrentTabRouter(newRoute: TRouterInfo) {