I have one this.state and i need pass in my componentDidMount with setState, how use bind(this) in setState?

Question

I have that pass Bind in setState, how to do? enter image description here

TypeError: Cannot read property 'setState' of undefined

I am using the RealTime Firebase and ReactJs

constructor() {
    super()
    this.app = firebase.initializeApp(firebase_config);
    this.database = this.app.database().ref().child('users');
    this.state = {
        users: []
    }
}
componentDidMount() {
  this.database.once("value", function(snapshot) {
      snapshot.forEach(function(data) {
          this.setState({users: data.val()})
      })
  });
}

render() {
   return (
    <BrowserRouter>
       <div className="App">
          <Navbar/>
          <Switch>
            <Route exact="exact" path='/' component={CampaingListClients}/>
          </Switch>
          <p>{this.state.users}</p>
       </div>
    </BrowserRouter>);
    }
}

TypeError: Cannot read property 'setState' of undefined

the `this` in `this.setState` binds to the inner function and not the React component. — paqash, Feb 10 '19 at 11:23
Possible duplicate of [How does the "this" keyword work?](https://stackoverflow.com/questions/3127429/how-does-the-this-keyword-work) — Francisco, Feb 10 '19 at 12:26
This isn't a duplicate of how does "this" keyword work because this question is about react vs. general javascript. — DeltaFlyer, Feb 27 '19 at 01:39

Hemadri Dasari · Accepted Answer · 2019-02-10T11:44:46.687

You can resolve setState undefined issue in two ways

Change your functions to arrow functions

componentDidMount() {
    this.database.once("value", snapshot => {
       snapshot.forEach(data => {
          this.setState({users: data.val()})
       })
    });
 }

Bind each function like below

  componentDidMount() {
     this.database.once("value", function(snapshot) {
         snapshot.forEach(function(data) {
             this.setState({users: data.val()})
         }.bind(this)}
     }.bind(this));
   }

I have one this.state and i need pass in my componentDidMount with setState, how use bind(this) in setState?

1 Answers1

Linked