This.SetState 不起作用

Question

我知道问题可能出在主登录功能中的功能上，但我无法抓住它。它返回此错误：

Unhandled Rejection (TypeError): undefined is not an object (evalating 'this.setState')

export default class Main extends React.Component{
  constructor(){
    super()
    this.state = {
      logged: null,
      name: "Felicia"
    };
  }
  login(e){
    const email = document.getElementById('txtEmail').value;
    const password = document.getElementById('txtPass').value;
    firebase.auth().signInWithEmailAndPassword(email, password);
    firebase.auth().onAuthStateChanged(function(user) {
        if (user) {
          console.log("There is a user logged");
          console.log(user.email);
          this.setState({ name: firebase.auth.currentUser.displayName, logged: "true" })
        } else {
          console.log("No user Logged");
        }
      }).bind(this)

render(){
if(this.state.logged){
  return <Student name={this.state.name} />
} else {
  return (
    <div className="container">
    <div className="row">
    <div className="col-md-6 loginform">
    <input type="email" id="txtEmail" className="form-control" placeholder="email@email.co.uk" />
    <small id="emailHelp" className="form-text text-muted">Well never share your email with anyone else.</small>
    <input type="password" id="txtPass" className="form-control" placeholder="password"/>
    <button onClick={this.login} className="btn btn-primary">Login</button>
    </div>
    </div>
    </div>
  )
}
  }
}

你能帮我解决这个问题吗？

Answer 1

您没有将回调函数绑定到此。您应该将onAuthStateChanged的回调函数绑定到this，如

firebase.auth().onAuthStateChanged((function(user) {
     ...
}).bind(this))