类型“IntrinsicAttributes & NavigateProps”上不存在属性“from”-react-router-dom v6答案

【问题标题】：Property 'from' does not exist on type 'IntrinsicAttributes & NavigateProps' - react-router-dom v6类型“IntrinsicAttributes & NavigateProps”上不存在属性“from”-react-router-dom v6
【发布时间】：2022-06-29 23:50:01
【问题描述】：

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

键入'{键：字符串；来自：字符串；去任何; }' 不可分配给输入“IntrinsicAttributes & NavigateProps”。属性“来自”不存在于类型“IntrinsicAttributes & NavigateProps”上。

我不知道是否必须用 react-router-dom v6 中的其他内容替换它，但我们将不胜感激。

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

【问题讨论】：

标签： react-router react-router-dom

【解决方案1】：

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

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

应用于你的代码sn-p：

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

【讨论】：

路由没有“to”属性，应该是“element”
@sivasakthi 哎呀。谢谢你抓住那个。仅供参考，您还可以建议对帖子进行编辑以改进它们。干杯。