在用户使用passportjs成功登录时重定向React.js中的页面,可以通过以下步骤实现:
history
对象来进行页面重定向。history
对象可以通过React Router提供的withRouter
高阶组件来获取。history.push()
方法来重定向到指定的页面。你可以传递一个路径作为参数,例如history.push('/dashboard')
。/dashboard/:userId
,你可以使用history.push(
/dashboard/${userId})
来重定向,并将userId
作为参数传递。以下是一个示例代码:
import React from 'react';
import { withRouter } from 'react-router-dom';
class Login extends React.Component {
handleLoginSuccess = () => {
// 在登录成功的回调函数中获取认证凭证
const authToken = 'your_auth_token';
// 使用React Router的withRouter高阶组件获取history对象
const { history } = this.props;
// 重定向到指定页面
history.push('/dashboard');
// 如果需要传递参数,可以这样做
// const userId = '123';
// history.push(`/dashboard/${userId}`);
}
render() {
return (
<div>
{/* 登录表单 */}
<button onClick={this.handleLoginSuccess}>登录</button>
</div>
);
}
}
export default withRouter(Login);
在上述示例中,当用户点击登录按钮并成功登录后,会调用handleLoginSuccess
方法。在该方法中,获取到认证凭证后,使用history.push()
方法重定向到指定页面(例如/dashboard
)。如果需要传递参数,可以在重定向路径中添加参数。
云+社区技术沙龙[第8期]
云+社区技术沙龙[第17期]
云原生正发声
Elastic 中国开发者大会
serverless days
腾讯位置服务技术沙龙
Elastic 中国开发者大会
Elastic 中国开发者大会
云+社区技术沙龙[第6期]
云+社区技术沙龙[第9期]
领取专属 10元无门槛券
手把手带您无忧上云