在React中，可以使用路由（react-router）来进行页面的跳转和传递参数。以下是一种常用的方法：
1.首先，确保你已经安装了react-router-dom。如果还没有安装，可以通过以下命令进行安装：
npm install react-router-dom
或者
yarn add react-router-dom
2.在需要跳转的组件中，使用<Link>或<NavLink>标签进行页面的跳转，并在state属性中传递参数。例如：
import { Link } from 'react-router-dom';
function MyComponent() {
return (
react router v6 文档
<div>
<Link to="/target" state={{ param1: 'value1', param2: 'value2' }}>Go to Target</Link>
</div>
);
}
在这个例子中，我们通过state属性传递了两个参数param1和param2。
3. 在目标组件中，使用useLocation钩子来获取传递的参数。例如：
import { useLocation } from 'react-router-dom';
function TargetComponent() {
const location = useLocation();
const param1 = location.state?.param1; // 使用可选链操作符获取param1，避免undefined错误
const param2 = location.state?.param2; // 使用可选链操作符获取param2，避免undefined错误
return (
<div>
<p>Param1: {param1}</p>
<p>Param2: {param2}</p>
</div>
);
}
在这个例子中，我们通过useLocation钩子获取了传入的参数，并显示在页面上。请注意，我们使用了可选链操作符（?.）来获取param1和param2的值，这可以避免在未定义的情况下抛出错误。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。