component

    반응형
    이미지21

    [ React ] 리액트 Map 과 데이터 랜더링

    이번 게시글에선 Map 을 사용해 데이터를 직접 랜더링해보는 과정을 볼 것이다. ​ 이전 게시글의 소스를 기반으로 수정하여 사용했음을 참고. ​ ​ ​ ​ 이번엔 직원이름, 연차를 입력받아 등록하는 화면을 만들고자 한다. ​ 사용하게 될 js 파일을 먼저 요약정리부터 해본다면 아래와 같다. ​ App.js - 메인컴포넌트. UserInput.js ( 입력폼 ) 과 UserProfileList.js ( UserProfile Data List ) 를 호출. UserInput.js - 신규 유저를 등록하는 입력폼 컴포넌트. UserProfileList.js - 유저의 정보 ( JSX ) 를 가지고 있는 List 컴포넌트. UserProfile.js - 각각 개별의 유저 정보 컴포넌트. ​ ​ 먼저 메인 컴포넌..