ReactJS - /path/:id 使用字符串重定向：id 而不是 id 值

Question

我正在用 react-router 编写重定向规则。定义我的 路线 如下：

{
  path: '/inputs',
  component: InputsContainer,
  label: 'Inputs',
  icon: 'fal fa-mobile',
  menu: false,
  routes: [
    {
      path: '/inputs',
      component: () => <Redirect to="/om/inputs" />,
      index: true,
      exact: true
    },
    {
      path: '/inputs/:id',
      component: (location) => <Redirect exact from="/inputs/:id" to={`/om/orders/:id`} />,
      label: "Order Details",
      menu: false
    },
    notFoundRoute
  ]
}

在这里，/inputs 重定向到 /om/inputs 没有任何问题。但是 /inputs/23 被重定向到 /om/input/:id

我在这里缺少什么？我希望将其重定向到 /om/inputs/23

Answer 1

您需要提供一个 url 而不是Redirect 的路径。由于您使用的是渲染道具模式，您可以使用match.params.id 获取它，其中match 是从回调函数参数中获得的。确保使用 render 而不是 Component 作为 Route 的道具

{
  path: '/inputs',
  component: InputsContainer,
  label: 'Inputs',
  icon: 'fal fa-mobile',
  menu: false,
  routes: [
    {
      path: '/inputs',
      render: () => <Redirect to="/om/inputs" />,
      index: true,
      exact: true
    },
    {
      path: '/inputs/:id',
      render: ({match}) => <Redirect exact from="/inputs/:id" to={`/om/orders/${match.params.id}`} />,
      label: "Order Details",
      menu: false
    },
    notFoundRoute
  ]
}