React with ES7: Uncaught TypeError: Cannot read property 'state' of undefined [duplicate] React with ES7: Uncaught TypeError: Cannot read property 'state' of undefined [duplicate] reactjs reactjs

React with ES7: Uncaught TypeError: Cannot read property 'state' of undefined [duplicate]


You have to bind your event handlers to correct context (this):

onChange={this.setAuthorState.bind(this)}


Make sure you're calling super() as the first thing in your constructor.

You should set this for setAuthorState method

class ManageAuthorPage extends Component {  state = {    author: { id: '', firstName: '', lastName: '' }  };  constructor(props) {    super(props);    this.handleAuthorChange = this.handleAuthorChange.bind(this);  }   handleAuthorChange(event) {    let {name: fieldName, value} = event.target;    this.setState({      [fieldName]: value    });  };  render() {    return (      <AuthorForm        author={this.state.author}        onChange={this.handleAuthorChange}      />    );  }}

Another alternative based on arrow function:

class ManageAuthorPage extends Component {  state = {    author: { id: '', firstName: '', lastName: '' }  };  handleAuthorChange = (event) => {    const {name: fieldName, value} = event.target;    this.setState({      [fieldName]: value    });  };  render() {    return (      <AuthorForm        author={this.state.author}        onChange={this.handleAuthorChange}      />    );  }}