Component LoginForm have following code:
class LoginForm extends React.Component {
.................................................................
onSubmit = (e) => {
e.preventDefault();
const errors = this.validate(this.state.data);
this.setState({ loading: true});
this.props.submit(this.state.data).catch(console.log("errors"));
}
.....................................................................
}
LoginForm.PropTypes = {
submit: PropTypes.func.isRequired
};
export default LoginForm;
When i submit button I get error TypeError: Cannot read property 'catch' of undefined
Component LoginPage
class LoginPage extends React.Component {
submit = data => {
this.props.login(data).then(() => this.props.history.push("/"));
}
render() {
return(
<div className="login-page">
<main>
<div className="login-block">
<img src="assets/img/logo.png" alt=""/>
<h1>Log into your account</h1>
<LoginForm submit={this.submit} />
</div>
<div className="login-links">
<a className="pull-left" href="user-forget-pass.html">Forget Password?</a>
<a className="pull-right" href="user-register.html">Register an account</a>
</div>
</main>
</div>
);
}
}
LoginPage.propTypes = {
history: PropTypes.shape({
push: PropTypes.func.isRequired
}).isRequired,
login: PropTypes.func.isRequired
};
export default connect(null, {login})(LoginPage);
actions/auth
import { USER_LOGGED_IN } from "../types";
import api from "../api";
export const userLoggedIn = user => ({
type: USER_LOGGED_IN,
user
});
export const login = credentials => dispatch =>
api.user.login(credentials)
.then(user => dispatch(userLoggedIn(user)));
Can you please explain why undefined catch? Function submit return result with promise then().
You should move the catch
to the LoginPage
:
submit = data => {
this.props.login(data)
.then(() => this.props.history.push("/"))
.catch(console.log)
}
And pass the error to LoginForm
as prop if needed.
Remove the {} at the promise. It should be like this
submit = data => this.props.login(data).then(() => this.props.history.push("/"));
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.