如何使用导航将道具传递到下一个屏幕

Question

<Navigate to={"/plans"} />; 我正在使用它导航到计划页面，但我想用它发送一些数据，知道我该怎么做吗？编程新手

Answer 1

Navigate在组件的prop上传递路由状态中的数据state。

导航

declare function Navigate(props: NavigateProps): null;

interface NavigateProps {
  to: To;
  replace?: boolean;
  state?: State;
}

用法：

<Navigate to={"/plans"} state={{ data }} />

要访问目标路由组件上的路由状态，请使用useLocation钩子访问它。

const { state } = useLocation();

...

const { data } = state;