뭐든 즐기면서 ;)

※ 주의사항 * JSX 콜백 안에서 this를 사용할 경우에 주의해야 합니다. 1. Bind 사용 - bind를 해주기 전과 후의 차이점 아래 코드 중 'this.handleClick = this.handleClick.bind(this);'에 집중해 주세요. constructor에 작성한 '.bind(this)'를 통하여 'constructor'와 'handleClick' 함수 내에서 this를 확인하였을 때, 같은 객체(Toggle 클래스)를 가리키는 것을 확인할 수 있습니다. (이미지 참고) bind처리를 하였을 때 class Toggle extends React.Component { constructor(props) { super(props); this.state = {isToggleOn: true..

※ React에서 Event 처리하는 방법 React의 이벤트는 소문자 대신 캐멀 케이스(camelCase)를 사용합니다. JSX를 사용하여 문자열이 아닌 함수로 이벤트 핸들러를 전달합니다. - javascript와 React에서의 함수 이벤트 적용 방법 차이점. 1. 함수 이벤트 적용 방법 아래는 javascript에서의 함수 이벤트 적용 방법입니다. // javascript Activate Lasers 아래는 React에서의 함수 이벤트 적용 방법입니다. // React Activate Lasers 2. 이벤트를 막는 방법 * javascript에서는 return false;를 하면 이벤트를 막을 수 있지만, React에서는 적용되지 않습니다. 다른 방법으로 preventDefault;를 명시적으로 ..