문제

강의를 듣고 있던 도중에 TypeError: Cannot read property ‘setState’ of undefined”가 발생하였다.

원인

원인은 호출하는 함수가 bind되지 않아서 그렇다.

onChange에 연결할 함수로 this.handleChange를 지정했다면 this.handleChange 함수는 아래 두 가지 방법 중 한 가지 방법으로 구현되어 있어야 한다.

this.handleChange = this.handleChange.bind(this);

handleChange = (props) => { ... }

화살표 함수로 구현하면 자동으로 바인딩이 되기 때문에 생성자에서 명시적으로 바인딩을 해주지 않아도 된다. 달리 말해 화살표 함수를 쓰지 않는다면 생성자에서 바인딩을 해줘야 한다. 별것 아니지만 리액트 문법에 익숙하지 않는 사람들이 흔히 겪는 실수다.

----

강의가 옛날 버전이어서 그런가...역시 구글링을 하면 할수록 꿀팁이 많이 나와서 좋다.

나 같은 경우는 바인딩할때 단순 오타가 있어서였다.