2

私は現在、Meteor と React を使用してアプリケーションを作成しようとしていますが、ログイン フォームの作成に行き詰まっています。ReactComponent.state実際、フォームのエラーを保存して表示するために使用したい

Meteor.loginWithPassword(email, password, err => {
  if (err) {
    this.setState({error: true, errorMessage: "User not found or password incorrect!"});
    return;
  } else {
  }
});

残念ながら、これはうまくいかないようです (警告が発生します):

Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op. Please check the code for the Signin component.

必要ないかもしれませんが、エラーを表示するためrenderに使用する関数は次のとおりですReactComponent.state

render() {
return <form onSubmit={this.handleSubmit}>
  {this.state.error
    ? <p style={{
        color: 'red'
      }}>{this.state.errorMessage}</p>
    : ""}
  <label>Email</label>
  <br/>
  <input type="email" value={this.state.email} onChange={this.handleChange('email')} required/>
  <br/>
  <label>Password</label>
  <br/>
  <input type="password" value={this.state.password} onChange={this.handleChange('password')} required/>
  <br/><br/>
  <button type="submit">Sign in</button>
</form>
}

関数のMeteor.loginWithPassword中にありhandleSubmitます。コールバックで更新できないと思いReactComponent.stateますが、それを機能させる理由と方法がわかりません。

もちろん、initialStateコンポーネントの を忘れていません:

getInitialState: function() {
  return {email: '', password: '', error: false, errorMessage: ''};
},

ありがとうございました

4

1 に答える 1