React - Objects are not valid as a React child 에러 해결

react-admin에서 데이터에 있는 요소를 골라 추출을 하는 작업을 하는데 이렇게 "Objects are not valid as a React child"라는 에러가 발생했다.

이 에러가 발생한 이유는 컴포넌트로 전달된 데이터와 출력하려는 데이터의 타입이 일치하지 않아서 발생하는 에러였다.
React Component를 렌더링할 때, 데이터를 출력하려면 전달된 데이터와 출력할 데이터의 타입을 일치시켜 주어야 한다.

에러의 원인

data만 출력을 하게 되면 Array 형식의 데이터를 Object형식으로 출력을 하게 되므로 에러가 발생한다.

에러 해결

product의 name만 출력하는 것이 목적이므로, data의 특정 attribute인 name을 가져오는 것으로 수정하였다.

느낀점

전달되는 데이터의 타입과 출력할 데이터의 타입을 다시 한번 잘 확인해야겠다!