diff --git a/src/layouts/BasicLayout.tsx b/src/layouts/BasicLayout.tsx
index 3b58522..2b5bedf 100644
--- a/src/layouts/BasicLayout.tsx
+++ b/src/layouts/BasicLayout.tsx
@@ -34,7 +34,12 @@ const MenuRender = (item: any, isSubMenu: boolean) => {
);
};
-const BreadcrumbRender = (routeBreadcrumb: any, intl: any, history: any, dynamicBreadcrumbName: string | null) => {
+const BreadcrumbRender = (
+ routeBreadcrumb: any,
+ intl: any,
+ history: any,
+ dynamicBreadcrumbName: string | null,
+) => {
const breadcrumbRoutes = routeBreadcrumb?.routes;
return (
@@ -43,22 +48,17 @@ const BreadcrumbRender = (routeBreadcrumb: any, intl: any, history: any, dynamic
history.push('/');
}}
>
-
- {intl.formatMessage({ id: 'menu.首页' })}
-
+ {intl.formatMessage({ id: 'menu.首页' })}
{breadcrumbRoutes?.map((item: any, index: number) => {
// 判断是否是最后一个面包屑项且存在动态名称
- const isLastItem = index === (breadcrumbRoutes.length - 1);
- const displayName = (isLastItem && dynamicBreadcrumbName)
- ? dynamicBreadcrumbName
- : intl.formatMessage({ id: `menu.${item.breadcrumbName}` || '' });
+ const isLastItem = index === breadcrumbRoutes.length - 1;
+ const displayName =
+ isLastItem && dynamicBreadcrumbName
+ ? dynamicBreadcrumbName
+ : intl.formatMessage({ id: `menu.${item.breadcrumbName}` || '' });
- return (
-
- {displayName}
-
- );
+ return {displayName};
})}
);
@@ -77,10 +77,12 @@ const BasicLayout: React.FC = (props) => {
const intl = useIntl();
const history = useHistory();
+ console.log('tab model state:', tab);
+
const handleTabChange = (key: string) => {
dispatch({
type: 'tab/switchTab',
- payload: { key }
+ payload: { key },
});
};
@@ -88,7 +90,7 @@ const BasicLayout: React.FC = (props) => {
if (action === 'remove') {
dispatch({
type: 'tab/closeTab',
- payload: { key: targetKey }
+ payload: { key: targetKey },
});
}
};
@@ -118,7 +120,11 @@ const BasicLayout: React.FC = (props) => {
// breadcrumbRender: ({ breadcrumb: routeBreadcrumb }) =>
// BreadcrumbRender(routeBreadcrumb, intl, history, breadcrumb.breadcrumbName),
}}
- tabList={tab.tabList}
+ // 将tab.tabList转换为需要的格式,添加国际化处理
+ tabList={tab.tabList.map(item => ({
+ ...item,
+ tab: typeof item.tab === 'string' ? intl.formatMessage({ id: `menu.${item.tab}` }) : item.tab
+ }))}
tabProps={{
type: 'editable-card',
hideAdd: true,
@@ -127,7 +133,9 @@ const BasicLayout: React.FC = (props) => {
onEdit: handleTabEdit,
size: 'small',
tabBarGutter: 6,
- renderTabBar: (props, DefaultTabBar) => ,
+ renderTabBar: (propsTab, DefaultTabBar) => (
+
+ ),
}}
>
{children}
@@ -137,8 +145,9 @@ const BasicLayout: React.FC = (props) => {
);
};
-export default connect(({ breadcrumb, tab }: { breadcrumb: BreadcrumbState; tab: TabModelState }) => ({
- breadcrumb,
- tab
-}))(BasicLayout);
-
+export default connect(
+ ({ breadcrumb, tab }: { breadcrumb: BreadcrumbState; tab: TabModelState }) => ({
+ breadcrumb,
+ tab,
+ }),
+)(BasicLayout);
diff --git a/src/models/tab.ts b/src/models/tab.ts
index 8105cc8..56a14f4 100644
--- a/src/models/tab.ts
+++ b/src/models/tab.ts
@@ -168,6 +168,7 @@ const TabModel: TabModelType = {
payload: {
path: pathname,
key: pathname,
+ // 直接使用菜单名称作为国际化ID
tab: currentRoute.name || '未命名页面',
},
});