使用react js从url中获取值



在我的react js应用程序中有下一个情况。我有3个页面,其中一个页面是登录页面:

import "./styles.css";
import { Redirect, useLocation, useHistory } from 'react-router-dom';
export default function Login() {

return (
<div className="App">
<h1>This is Login Page</h1>
</div>
);
}

此页面的URL是nextmy-site/login.
这是用户访问我的网站时被重定向的默认页面。用户可以从不同的平台,如社交网站,另一个网站,其中存在一个链接到我的网站重定向。
问题:例如当用户从另一个平台访问链接my-site/admin/edit时,用户将被重定向到我的站点my-site/login。在此页面上,我想获得链接my-site/admin/edit并保存它,但如果我尝试获得useLocation()的链接,我只得到my-site/login,但我需要以某种方式获得登录页面上的链接my-site/admin/edit。问题:如何做到这一点?谁知道解决办法?

你可以在你的重定向组件中使用state对象来保存初始位置:

<Redirect
to={{
pathname: "/login",
state: { referrer: currentLocation }
}}
/>

我假设,您想在他/她登录后将用户重定向到my-site/admin/edit,然后需要获得my-site/admin/edit链接。从url获取价值的方法有很多。你可以使用React-router dom。您可以使用<Route path="my-site/:value" />

设置路径并通过props.match.params.value获取道具中的值。- react-router-documentation

最新更新