[TIL-122~123] 노마드코더 ReactJS #3.0~#3.5

#2 State

• state

 

안 좋은 예시

  <script type="text/babel">
    const root = document.querySelector("#root");

    let counter = 0;

    const countUp = () => {
      counter++;
      console.log(counter);
      ReactDOM.render(<Container />, root);
    };

    const Container = () => (
      <div>
        <h2>Total clicks: {counter}</h2>
        <button id="btn" onClick={countUp}>
          Click me
        </button>
      </div>
    );
    ReactDOM.render(<Container />, root);
  </script>

• 컴포넌트 안에 변수를 포함시킬 땐 {변수명}으로 함.
• "onClick" 이벤트에 함수를 넣을 때 {countUp}의 형태로 ()를 붙이지 않음.