javascript - 登录成功时token已经存在,如何移动到主页?
问题描述
如果您成功登录并获得令牌,则页面将重定向到主页,并且在我成功登录并获得令牌后,请查看拍摄的图片。
代码在登录文件夹中,感谢您的帮助。
const FormItem = Form.Item;
class Login extends Component {
constructor(props) {
super(props);
this.state = {
isAuthenticated: this.props.isAuthenticated,
errorMessage: null,
isErorloaded: false
};
}
handleRegisterGoogle = request => {
this.props.loginWithGoogle(this.props.history, request);
};
handleSubmit = e => {
try {
e.preventDefault();
this.props.form.validateFields(async (err, values) => {
if (!err) {
console.log("Received values of form: ", values);
await this.props.loginWithForm(values);
}
});
} catch (error) {
console.log(error);
}
};
render() {
console.log(this.props.token);
const { form } = this.props;
const { getFieldDecorator } = form;
const { errorMessage, isErorloaded,isAuthenticated } = this.state;
if (isAuthenticated === true) {
return <Redirect to="/" />;
}
console.log(errorMessage);
return (
<Form onSubmit={this.handleSubmit} className="login-form">
<FormItem className="login-form__input-text">
{getFieldDecorator("email", {
rules: [
{
type: "email",
required: true,
message: "Please input your email!"
}
]
})(
<Input
size={"large"}
prefix={
<Icon type={"user"} style={{ color: "rgba(0,0,0,.25)" }} />
}
placeholder={"Email"}
/>
)}
</FormItem>
<FormItem className="login-form__input-text">
{getFieldDecorator("password", {
rules: [
{
required: true,
message: "Please input your password!"
}
]
})(
<Input
size={"large"}
prefix={
<Icon type={"lock"} style={{ color: "rgba(0,0,0,.25)" }} />
}
placeholder={"Password"}
type="password"
/>
)}
</FormItem>
<FormItem className="login-form__checkBox">
{getFieldDecorator("remember", {
valuePropName: "checked",
initialValue: true
})(<Checkbox>{strings.login_remember_me}</Checkbox>)}
<a className="login-form__forgot" href="/">
{strings.login_forgot_password}
</a>
<div>
<Button
size={"large"}
htmlType="submit"
className="login-form__button__submit"
>
<h4>{strings.login_enter}</h4>
</Button>
<div className="login-form__error-box">
{isErorloaded ? (
<p className="login-form__error-notif"> {errorMessage}</p>
) : null}
</div>
</div>
<div className="login-form__separator">
<p className="login-form__separator__text">
{strings.login_option}
</p>
</div>
<div className="login-form__socmed-box">
<ButtonFacebook
className="login-form__socmed-button"
onSubmit={this.handleRegisterGoogle}
>
<p> {strings.facebook}</p>
</ButtonFacebook>
<ButtonGoogle
className="login-form__socmed-button"
onSubmit={this.handleRegisterGoogle}
>
<p> {strings.google}</p>
</ButtonGoogle>
</div>
<p style={{ marginTop: "70px" }}>
{strings.formatString(
strings.login_quote,
<a href="/register" className="login-form__register">
{strings.login_register}{" "}
</a>
)}
</p>
</FormItem>
</Form>
);
}
}
const mapStateToProps = state => ({
isAuthenticated: state.authentication.isAuthenticated,
token: state.authentication.token
});
const LoginForm = Form.create({})(Login);
export default connect(
mapStateToProps,
{ loginWithGoogle, loginWithForm }
)(LoginForm);
解决方案
推荐阅读
- informatica - 在目标中插入 xml 并在每次成功后将该文件名保存在另一个表中
- sql - 异步查询状态功能仅在同一会话中可用?
- c - 使用 sscanf 解析字符串
- sql - Db2 decimal 打印零而不是四舍五入到小数位
- oracle - 将 Varchar2 转换为日期 - 使用 Case/Decode/IIF 语句并在 1 个条件中设置空值
- javascript - 覆盖 redux-form-validators 中的默认消息
- ios - 是否可以在测试运行期间检测 AutoLayout 约束问题?
- c# - CodedUI,如何将其他控件添加到先前映射的层次结构/页面中
- javascript - 来自表单输入字段的JS关联数组
- azure - Azure 函数无法发布并出现“PackageDependencyResolution.targets”错误