Ant-design-pro: 关于路由里面path带参数的问题，src/common/router.js

[lamjack]

getRouterData方法里面routerConfig，例如我这样定义

...
 const routerConfig = {
        '/': {
            component: dynamicWrapper(app, ['user'], () => import('../layouts/BasicLayout')),
        },
        '/analytics/news': {
            component: dynamicWrapper(app, ['analytics'], () => import('../routes/News/Search')),
        },
        '/analytics/news/:id': {
            component: dynamicWrapper(app, [], () => import('../routes/News/Analytics')),
        },
    };
...

一个是作为列表页，一个是作为内页，然后无论是 /analytics/news 还是 /analytics/news/12 都是走的 /analytics/news

[lamjack]

哎哟喂我知道了。

[colinzhy]

@lamjack 方便分享一下吗？我们也正碰到这个问题

[lamjack]

@colinzhy 需要重新改下 utils/utils.js 里面的getRoutes代码，把exact的参数由外部传入即可。

const exact = routerData[`${path}${item}`].exact !== false;

getRenderArr函数的逻辑也需要修改下，这是我的，

function getRenderArr(routes) {
    let renderArr = [];
    renderArr.push(routes[0]);
    for (let i = 1; i < routes.length; i += 1) {
        let isAdd = false;
        isAdd = renderArr.every(item => getRelation(item, routes[i]) !== 0);
        renderArr = renderArr.filter(item => getRelation(item, routes[i]) !== 1);
        if (isAdd) {
            renderArr.push(routes[i]);
        }
    }
    return renderArr;
}

[colinzhy]

非常感谢，我现在用另一种方法实现了这个功能，不知到对你是否有用：
首先，路由的定义：

const routerConfig = {
        '/': {
            component: dynamicWrapper(app, ['user'], () => import('../layouts/BasicLayout')),
        },
        '/analytics/news/list': {
            component: dynamicWrapper(app, ['analytics'], () => import('../routes/News/Search')),
        },
        '/analytics/news/:id/profile': {
            component: dynamicWrapper(app, [], () => import('../routes/News/Analytics')),
        },
    };

然后，菜单的定义：

const menuData = [
{
    name: "analytics.news",
    icon: analytics,
    path: "analytics",
    children: [
      {
        name: "",
        icon: "",
        path: "news",
        hideMenu: true
      },
      {
        name: "",
        icon: "",
        path: ":id/profile",
        hideMenu: true
      }
    ]
  }
]

不是很确定不带/profile是否可以。

重点应该是list页面的菜单拼起来的路由不能是view页面拼起来的路由的父节点。

[callmez]

这块的功能是不是需要官方来处理下..虽然我们的问题可以通过修改解决. 但是新用户还是会有这个坑的...

还是需要官方来做下兼容吧

[USTCLX]

非常感谢，解决了我的问题

[lee813]

An ugly fix, hope can inspire someone

export function getRoutes(path, routerData) {
  const routes = Object.keys(routerData).filter(
    routePath => routePath.indexOf(path) === 0 && routePath !== path
  );

  const renderArr = routes.map(item => item.replace(path, ""));

  const renderRoutes = renderArr.map(item => {
    const exact = true
    // !routes.some(route => route !== item && getRelation(route, item) === 1);
    return {
      exact,
      ...routerData[`${path}${item}`],
      key: `${path}${item}`,
      path: `${path}${item}`
    };
  });
  return renderRoutes;
}