useState 사용 시 배열 아이템 업데이트 방법

React Hooks - useState

The useState hook allows us to make our function components stateful. Create and Initial...

dev.to

위 글 참고했는데 더 좋은 방법이 있으면 댓글로 알려주시길 바랍니다 ㅜㅜ

// 업데이트 함수

const UpdateSns = (e, index) => {
    setUserSns(
      userSns.map((item, idx) => (idx === index ? e.target.value : item))
    );
  };

// onChange에 업데이트 함수 넣어주기

{userSns.map((item, idx) => (
  <InputSns
    key={idx}
    sns={item}
    onChange={(e) => UpdateSns(e, idx)}
  />
))}

현재 변경되는 input의 index가 userSns item의 idx와 같다면 새로운 값(e.target.value)를 넣어주고, 그렇지 않다면 기존 item을 그대로 넣어주는 방식

blogsy