mirror of
https://github.com/Tencent/tdesign-vue-next-starter.git
synced 2024-12-23 02:56:35 +08:00
feat: tabs-router 支持存储路由的query,保证切换tab时,能保留页面参数 (#269)
* feat: tabs-router 支持存储路由的query,保证切换tab时,能保留页面参数 * fix: 设置 TRouterInfo.query 可空 可为null
This commit is contained in:
parent
0c6ae6a286
commit
14a345c5d3
|
@ -63,10 +63,11 @@ export default defineComponent({
|
||||||
const appendNewRoute = () => {
|
const appendNewRoute = () => {
|
||||||
const {
|
const {
|
||||||
path,
|
path,
|
||||||
|
query,
|
||||||
meta: { title },
|
meta: { title },
|
||||||
name,
|
name,
|
||||||
} = route;
|
} = route;
|
||||||
tabsRouterStore.appendTabRouterList({ path, title: title as string, name, isAlive: true });
|
tabsRouterStore.appendTabRouterList({ path, query, title: title as string, name, isAlive: true });
|
||||||
};
|
};
|
||||||
|
|
||||||
const getTabRouterListCache = () => {
|
const getTabRouterListCache = () => {
|
||||||
|
@ -105,17 +106,19 @@ export default defineComponent({
|
||||||
|
|
||||||
tabsRouterStore.subtractCurrentTabRouter({ path, routeIdx: index });
|
tabsRouterStore.subtractCurrentTabRouter({ path, routeIdx: index });
|
||||||
if (path === route.path) {
|
if (path === route.path) {
|
||||||
router.push(nextRouter.path);
|
router.push({ path: nextRouter.path, query: nextRouter.query });
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
const handleChangeCurrentTab = (path: string) => {
|
const handleChangeCurrentTab = (path: string) => {
|
||||||
router.push(path);
|
const { tabRouters } = tabsRouterStore;
|
||||||
|
const route = tabRouters.find((i) => i.path === path);
|
||||||
|
router.push({ path, query: route.query });
|
||||||
};
|
};
|
||||||
const handleRefresh = (currentPath: string, routeIdx: number) => {
|
const handleRefresh = (route: TRouterInfo) => {
|
||||||
tabsRouterStore.toggleTabRouterAlive(routeIdx);
|
tabsRouterStore.toggleTabRouterAlive(route.routeIdx);
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
tabsRouterStore.toggleTabRouterAlive(routeIdx);
|
tabsRouterStore.toggleTabRouterAlive(route.routeIdx);
|
||||||
router.replace({ path: currentPath });
|
router.replace({ path: route.path, query: route.query });
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
const handleCloseAhead = (path: string, routeIdx: number) => {
|
const handleCloseAhead = (path: string, routeIdx: number) => {
|
||||||
|
@ -195,7 +198,7 @@ export default defineComponent({
|
||||||
dropdown: () =>
|
dropdown: () =>
|
||||||
router.path === route.path ? (
|
router.path === route.path ? (
|
||||||
<t-dropdown-menu>
|
<t-dropdown-menu>
|
||||||
<t-dropdown-item onClick={() => handleRefresh(router.path, idx)}>
|
<t-dropdown-item onClick={() => handleRefresh(router)}>
|
||||||
<t-icon name="refresh" />
|
<t-icon name="refresh" />
|
||||||
刷新
|
刷新
|
||||||
</t-dropdown-item>
|
</t-dropdown-item>
|
||||||
|
|
1
src/types/interface.d.ts
vendored
1
src/types/interface.d.ts
vendored
|
@ -36,6 +36,7 @@ export interface NotificationItem {
|
||||||
|
|
||||||
export interface TRouterInfo {
|
export interface TRouterInfo {
|
||||||
path: string;
|
path: string;
|
||||||
|
query?: LocationQueryRaw;
|
||||||
routeIdx?: number;
|
routeIdx?: number;
|
||||||
title?: string;
|
title?: string;
|
||||||
name?: RouteRecordName;
|
name?: RouteRecordName;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user