反应路由器-dom6升级帮助：所有组成的儿童的<路线>必须<路线>或<作出反应。片段>

Question 1

我们最近更新的应用程序的测试版本的反应路由器-dom，事情是好的。然后当我试图更新6.0.2，我得到大量的不变的错误 All component children of <Routes> must be a <Route> or <React.Fragment>. 这是因为我们有我们的路线界定如下：

功能。代码:

export const FeatureRoutes = () => (
  <Routes>
    <Route path="/" element={<Feature1 />} />
    <Route path="/*" element={<NotFound />} />
  </Routes>
);

路线。代码:

export const routes = [
  {
    path: "feature",
    component: FeatureRoutes,
  },
  /* lots of other routes, defined the same way: <Route> wrapped in a component */
];

应用程序。代码:

<Routes>
  {routes.map((route) => (
    <Route key={route.path} path={`${pathPrefix}/${route.path}/*`}>
      <route.component />
    </Route>
  ))}
</Routes>

现在这个结果中的错误之上，因为内的路线(例如 FeatureRoutes)是包裹在一个功能性组成部分。我已经尝试回返的文字代码但是，然后让另一个错误。我不知道该如何来解决这个问题：是唯一的答案完全重写我们如何定义我们的路线？我们也有一些路线都储存在后端和地图定义的组成部分-我不知道我怎么可以包装这些现在我不允许有分量之间的路线和路线。

任何建议赞赏。

Question 2

我相信一个小小的"重构"会得到你应用程序呈现一次。

在 routes 列名 component 要 Component 所以它可以被呈现为一个作出反应的成分，即作为一个正确命名的反应的成分(PascalCased).

const routes = [
  {
    path: "feature",
    Component: FeatureRoutes
  }
  /* lots of other routes, defined the same way: <Route> wrapped in a component */
];

当映射 routes 渲染的 Component 在 Route 组成的 element 支柱 作为代码.

<Routes>
  {routes.map(({ path, Component }) => (
    <Route
      key={path}
      path={`${pathPrefix}/${path}/*`}
      element={<Component />}
    />
  ))}
</Routes>

Drew Reese · Answer 1 · 2021-11-23T16:27:48

我相信一个小小的"重构"会得到你应用程序呈现一次。

在 routes 列名 component 要 Component 所以它可以被呈现为一个作出反应的成分，即作为一个正确命名的反应的成分(PascalCased).

const routes = [
  {
    path: "feature",
    Component: FeatureRoutes
  }
  /* lots of other routes, defined the same way: <Route> wrapped in a component */
];

当映射 routes 渲染的 Component 在 Route 组成的 element 支柱 作为代码.

<Routes>
  {routes.map(({ path, Component }) => (
    <Route
      key={path}
      path={`${pathPrefix}/${path}/*`}
      element={<Component />}
    />
  ))}
</Routes>

反应路由器-dom6升级帮助：所有组成的儿童的<路线>必须<路线>或<作出反应。片段>

的问题

最好的答案

其他语言

此页面有其他语言版本

受欢迎的此类别

流行的问题，在这个类别