Javascript

map관련 에러 (missiong key)

selonjulie 2022. 9. 28. 17:02

map()

 

react에서 map을 사용할 때 맞딱드린 문제

 

1. return을 적으니 뒤가 비활성화 되는 문제 -> return 뒤에 ()를 넣으므로서 해결

return () 안에 jsx 컴포넌트를 넣어야 리턴이 되고 jsx가 한줄일때만 예외적으로 ()를 생략할 수 있음

 

참고) fragment error: 리액트는 return문의 루트 요소로 두 개의 컴포넌트가 나란히 렌더링되는 것을 허용하지 않음. 그러므로 하나의 요소로 감싸주어야 한다.

 

 

2. missing key 에러 -> key를 추가하면서 해결

리액트는 각 아이템을 효율적으로 업데이트해서 랜더링하기 위해 key값이 필요함