javascript - 我可以将自定义参数/道具从 config.js 传递到面包屑吗？[Pro Antd React]

Question

我有pro antd 应用程序。

我有一个问题：我希望我的面包屑项目的名称与配置中的名称不同。

我想在 config.js 中传递当前路由的面包屑标签的参数

我该怎么做？

在itemRender方法中，参数路由没有自定义道具，我将其传递给 config.js。

Answer 1

根据 antd pro 文档

面包屑由PageHeaderWrapper实现，Layout会根据MenuData生成的面包屑由PageHeaderWrapper进行渲染。PageHeaderWrapper 封装到 Ant Design 的 PageHeader 中，api 是一样的。

我更改面包屑标签的方式是在locale本地化文件夹中设置值 then menu.js。然后在配置中使用相同的名称进行路由。
例如，假设我想 在 config.js 文件中将面包屑设置为 Then - settings/roles>My Setting/My Role

{
    name: 'settings',
    path: '/setting',
    routes:[
    {
       name: 'roles',
       path: '/setting/roles',
       component: './Setting/Roles',
    },
}

然后在src> locales> en-US>menu.js

'menu.settings' : "My Setting",
'menu.settings.roles' : "My Role",

然后我会得到面包屑My Setting/My Role 在这里我必须去en-US>menu.js因为config.js我已经设置了

locale: {
    default: 'en-US',
}

要更改"/"名称之间的分隔符，请转到BasicLayout.jsx、查找itemRender，您会在其中找到

<Link to={paths.join('/')}>{route.breadcrumbName}</Link>

此行是显示在面包屑中的行。从menu.js，我们正在设置route.breadcrumbName