reactjs - this.state undefined in a method -

this question has answer here:

• how bind onclick handlers `this` on react 2 answers

i have custom component requires access 1 of actual component state (rows). defined in constructor when should rendered, this.state seems empty, , dont know why...

the console displays "undefined this.state".

here code :

export class tablecontainer extends react.component<any, any> {     constructor(props : any, context: any) {         super(props,context);         this.state = {              rows:[                  { id: 1, title: 'john', count: 32 },                 { id: 2, title: 'carl', count: 18 },                 { id: 3, title: 'mike', count: 25 }             ]         };     }      rowgetter(i: number) {         if(this.state) {             console.log('defined this.state');             return this.state.rows[i];         }         else {             console.log('undefined this.state');             return {};         }     }      render() {         return  (             <div id="events-container">                 <reactdatagrid                     columns={this.state.columns}                     rowgetter={this.rowgetter}                     rowscount={this.state.rows.length}                     minheight={500}                  />             </div>         );     }     } 

i'm new in react it's little mistake. have precise rowscount "this.state.rows.length" in render function.

thank advance

the function being called context. shoud bind function correct context:

rowgetter={this.rowgetter.bind(this)} 

or declare function via "fat arrow":

rowgetter = (i: number) => {     if(this.state) {         console.log('defined this.state');         return this.state.rows[i];     }     else {         console.log('undefined this.state');         return {};     } }