我有一个LoginForm组件。我要检查之前提交,这两个loginName和password设置。我尝试使用此代码(省略了很多内容):
loginName
password
class LoginForm extends Component { constructor() { super(); this.state = { error: "", loginName: "", password: "", remember: true }; } submit(e) { e.preventDefault(); if(!this.state.loginName || !this.state.password) { //this is null this.setState({ error: "Fill in both fields" }); } else { console.log("submitting form"); } } render() { return ( <div className="col-xs-12 col-sm-6 col-md-4"> <form className="login" onSubmit={this.submit}> <button type="submit" className="btn btn-default">Sign in</button> </form> </div> ); } } export default LoginForm;
但是,我TypeError在事件处理程序中得到一个,说this是空的。
TypeError
this
我该怎么办?
你需要设置this的submit方法,因为现在this是undefined,对于此操作,您可以使用.bind
submit
undefined
.bind
onSubmit={ this.submit.bind(this) }
Example
或者您可以使用箭头功能
onSubmit={ (e) => this.submit(e) }