属性 'from' 在类型 'IntrinsicAttributes & NavigateProps' 上不存在 - react-router-dom v6

Question

我从 react-router-dom 5 迁移到版本 6，您在下面看到的 Navigate 曾经是 Redirect。问题是 from={from}（第一个）中的 from 错误说

Type '{ key: string; from: string; to: any; }' is not assignable to type 'IntrinsicAttributes & NavigateProps'. Property 'from' does not exist on type 'IntrinsicAttributes & NavigateProps'.

我不知道是否必须用 react-router-dom 的 v6 中的其他东西替换它，但我们将不胜感激任何帮助。

    const redirects = routeAliases(routes).map(({ from, to }) => {
    return <Navigate key={`${from}-${to}`} from={from} to={{ ...location, pathname: to }} />;
  });

Answer 1

在 react-router-dom v6 中，要使用 from 属性完全复制 v5 的 Redirect 组件，您必须在 Route 组件中渲染 Navigate 组件。

<Route path={fromPath} to={<Navigate to={toPath} replace />} />

应用于您的代码段：

const redirects = routeAliases(routes).map(({ from, to }) => (
  <Route
    key={`${from}-${to}`}
    path={from}
    to={<Navigate to={{ ...location, pathname: to }} replace />}
  />
));

属性 'from' 在类型 'IntrinsicAttributes & NavigateProps' 上不存在 - react-router-dom v6

Property 'from' does not exist on type 'IntrinsicAttributes & NavigateProps' - react-router-dom v6

react-router

react-router-dom