홈 페이지 읽기 강좌 등 각종 정보를 제공했다.
그 중에서 주요 개념으로'사건 처리'라는 페이지에서 ON/OFF 스위치를 만들었지만 내 머릿속에는 보든 쓰든 잘 모르겠기 때문에 등장한 코드를 정리해 보았다.

먼저

이 페이지에서 모르는 일을 어떻게 조사해야 좋을지 모르겠으니 도와주세요.

완성형

메인 페이지에 아래 코드를 적으면 클릭한 ON과 OFF의 문자로 왕복 버튼을 표시하는 시계를 만들 수 있습니다

class Toggle extends React.Component {
  constructor(props) {
    super(props);
    this.state = {isToggleOn: true};
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick() {
    this.setState(state => ({
      isToggleOn: !state.isToggleOn
    }));
  }

  render() {
    return (
      <button onClick={this.handleClick}>
        {this.state.isToggleOn ? 'ON' : 'OFF'}
      </button>
    );
  }
}

ReactDOM.render(
  <Toggle />,
  document.getElementById('root')
);

알 수 없는 일

어쨌든 모르는 코드is ToggleOn: true , bind , !state.isToggleOn , {this.state.isToggleOn ? 'ON' : 'OFF'}bind 말고는 설명이 전혀 없어요(웃음)
그래서 아래에 쓴 것은 근거가 없습니다. 모두 제가 지금 이해하고 있습니다. 힌트와 참고 페이지가 있으면 댓글을 남겨 주십시오.
잘 부탁드립니다.

나의 이해

  constructor(props) {
    super(props);
    this.state = {isToggleOn: true};
    this.handleClick = this.handleClick.bind(this);
  }

여기에 초기 값이 설정되어 있습니다.
처음에 is Toggle On이 진짜였어요.

render() {
    return (
      <button onClick={this.handleClick}>
        {this.state.isToggleOn ? 'ON' : 'OFF'}
      </button>
    );
  }

여기에 버튼을 설정했습니다.
true는'ON'이고 false는'OFF'이죠.

 handleClick() {
    this.setState(state => ({
      isToggleOn: !state.isToggleOn
    }));
  }

handleClick 방법을 정의했습니다.
state의 내용을 변경하고 있습니다.
이 방법의 is Toggle On, 그 전 시각의state의 is Toggle On의 진위값!변경됐어요?

참고 자료

React HP