리액트 Create

백돼지·2023년 1월 12일
0

useState를 사용할때 데이터 유형이 범객체일때는 ...복제를 해서 사용을 해야한다.

state 를 사용할때, state의 값이 원시형(primitive: string,number,boolean등)인 경우

const [value,setValue] = useState(1);
setValue(2);	//value의 값을 1에서 2로 바꾸는 엄연히 다른 데이터이므로
				//다시 랜더링 된다.

하지만, 
  
const [value,setValue] = useState([1]);
value.push(2);	//value : [1,2]
setValue(value);	//랜더링 되지 않음.

>>이처럼 useState의 초기값이 범객체(객체,배열 등)일 경우에는 
리액트는 바뀌는 데이터가 같다고 생각하고(똑같은 하나의 배열이기 때문)랜더링을 다시 하지 않는다.

>>, 이때는 기존의 오리지널 value를 ...복제해서, 새로운 setValue를 넣어줘야한다.

const [value,setValue] = useState([1]);
newValue = [...value];	//객체일때는 {...value}
newValue.push(2);
setValue(newValue);		//두개는 서로 다른(복제된)데이터로써 이때 비로소 다시 랜더링 된다.
profile
용호의 코딩블로그 22.11 코딩공부 시작 23.2 부트캠프 입소

0개의 댓글