umi icon indicating copy to clipboard operation
umi copied to clipboard

[Bug] layout运行时配置面包屑自定义配置时无法获取到route中的component属性

Open LOCKD2016 opened this issue 3 years ago • 0 comments

What happens?

Umi4 layout运行时配置中 , 配置面包屑的itemRender属性 , 当前route中component属性值都是undefined , Umi3获取的值正常 , 需要根据component是否有值来判断当前面包屑是否可点击

Mini Showcase Repository(REQUIRED)

Please provide a minimal reproduction then upload to your GitHub. 请提供 最小重现,并上传到你的 GitHub 仓库

https://github.com/LOCKD2016/umi4-mini-showcase

const layout: RunTimeLayoutConfig = ({ initialState }) => {
  return {
    siderWidth: 208,
    breadcrumbRender: (routers = []) => [
      {
        path: '/',
        breadcrumbName: '首页',
      },
      ...routers,
    ],
    itemRender: (route, params, routes) => {
      const first = routes.indexOf(route) === 0;

      const currentRoute = routes.find((item) => item.path === route.path);
      if (first) {
        return <Link to="/">{route.breadcrumbName}</Link>;
      }
      // @ts-ignore
      Umi4获取到的component都是undefined
      if (currentRoute.component) {
        if (routes.indexOf(route) === routes.length - 1) {
          return <span>{route.breadcrumbName}</span>;
        }
        return <Link to={route.path}>{route.breadcrumbName}</Link>;
      }
      return <span>{route.breadcrumbName}</span>;
    },
    rightContentRender: () => <RightContent />,
    disableContentMargin: false,
    footerRender: () => <Footer />,
    onPageChange: () => {
      // 如果没有登录,重定向到 login
      if (!localStorage.token && location.pathname !== '/user/login') {
        history.push('/user/login');
      }
    },
    menuHeaderRender: undefined,
    ...initialState?.settings,
  };
}

Umi3

screenshot-20220722-161905

Umi4

screenshot-20220722-161505

Context

  • Umi Version:4.0.6
  • Node Version:16.14.0
  • Platform:windows

LOCKD2016 avatar Jul 22 '22 08:07 LOCKD2016