728x90
반응형
반응형
일단 작업 순서를 말하자면
1. CheckBox 리스트 데이터들을 만들기
2. checkbox를 위한 UI 만들기
3. onChange Function 만들기
4. Checked State를 부모 컴포넌트로 업데이트하기
LandingPage 폴더에 Sections라는 폴더를 만들고 거기에 Datas.js라는 파일을 생성해서 아래처럼 코드를 작성해서 CheckBox 리스트 데이터들을 만들었습니다.
이제 checkBox를 위한 UI를 만들어줄 차례입니다.
그 UI는 ant design에서 collapse라는 것을 이용하여 만들어줄 것입니다.
결과:
Landing.js
Checkbox.js
반응형
'사이드 프로젝트' 카테고리의 다른 글
| 쇼핑몰 사이트 만들기17(체크 박스 필터 만들기3) (0) | 2022.03.05 |
|---|---|
| 쇼핑몰 사이트 만들기16(체크 박스 필터 만들기2) (0) | 2022.03.04 |
| 쇼핑몰 사이트 만들기14(더보기 버튼 만들기2) (0) | 2022.03.03 |
| 쇼핑몰 사이트 만들기13(더보기 버튼 만들기) (0) | 2022.03.01 |
| 쇼핑몰 사이트 만들기12(이미지 슬라이더 만들기) (0) | 2022.03.01 |