State 데이터 변경

function App() {

  let posts = 'test title';

  let[글제목, 글제목변경] = useState(['글제목1','글제목2','글제목3']);

  let[따봉, 따봉변경] = useState(0)

  let cssClass = { color : 'blue', fontSize : '30px'};

  return (
    <div className="App">
      <div className='black-nav'>
        <div>개발 Blog</div>
      </div>
      <div className='list'>
        <h3>{ 글제목[0] } <span onClick={ ()=>{따봉변경(따봉+1)}}>👍</span> {따봉} </h3>
        <p>2월 17일 발행</p>
        <hr/>
      </div>
      <div className='list'>
        <h3>{ 글제목[1] }</h3>
        <p>2월 17일 발행</p>
        <hr/>
      </div>
      <div className='list'>
        <h3>{ 글제목[2] }</h3>
        <p>2월 17일 발행</p>
        <hr/>
      </div>
    </div>  
  );
}

state 생성 후 해당 state를 변경하기 위해선 state 데이터 변경 함수를 사용해서 데이터를 변경해야 한다.

React 대원칙 : immutable data (데이터는 직접 수정이 되어선 안된다.)

요약

1. state의 데이터 변경은 state데이터 변경함수를 사용한다.
2. state데이터는 직접 건들여서는 안된다! ⇒ 데이터를 copy한 뒤에 수정 후 변경함수로 변경하도록 해야한다.