List컴포넌트에서 필터링 하는 것과 App 컴포넌트에서 필터링하는 것의 차이
🚨 필독) 질문하시기 전에 꼭 읽어주세요 (10초 소요)
제목을 구체적으로 작성해 주세요
✅ 좋은 예 : 감정일기장 Home 구현중 xx 이슈가 발생합니다.
⛔️ 나쁜 예 : 이거 왜 안되나요?, 오류나요 도와주세요 등
비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요!
코드의 이슈는 전체 프로젝트를 "링크 형태"로 올려주셔야 원인을 파악할 수 있습니다.
깃허브, 구글드라이브 등의 수단을 통해 링크 형태로 전달해주세요
직접 실행해보며 원인을 파악해야 하기 때문에 텍스트 형태로 붙여넣는건 삼가해주세요 🥲
답변이 도움이 되셨다면 답글 or 해결완료 버튼을 클릭해주세요
비슷한 궁금함을 갖고 계신 분들께 도움이 될 수 있어요!
제 답변이 여러분께 도움이 되었는지 저도 알고 싶어요 🥲
강의 내용에 궁금한 점이 있다면 몇 챕터의 몇 분 몇 초인지 알려주시면 더 좋아요
더 빠른 답변이 가능합니다!
안녕하세요. 강사님!
8.5) Read - 투두리스트 렌더링하기
강의에서 질문이 있습니다.
검색어로 필터링하는 기능이 List.jsx에 되어있는데요, 이 부분 관련해서 질문이 있습니다.
필터링이 App.jsx에서 필터링 하는 것과 어떤 차이가 있나요??
어떤 이유에서 List.jsx에서 필터링하는지도 궁금합니다. (원본 데이터를 건들지않기 위함(?)일까요?)
그리고 어떤 컴포넌트에서 필터링 하더라도 리렌더링이 발생하는건가요?
감사합니다!
답변 2
0
안녕하세요 이정환입니다.
우선 필터링 과정을 List 컴포넌트에서 수행하는 이유는 단순히 필터링 된 데이터가 오직 List 컴포넌트에서만 필요하기 때문입니다. 기능상의 차이는 없지만 만약 App 컴포넌트에서 데이터를 필터링하게 되면 해당 데이터를 또 Props로 전달해 줘야 하는 불편함이 생깁니다.
추가로 필터링 과정과 리렌더링은 큰 연관이 있지 않습니다. 리렌더링은 새로운 일기를 추가하거나 수정, 삭제 했을 때에 App 컴포넌트의 data State가 변경되어 App 컴포넌트가 리렌더링되면서 발생하게 됩니다.
Editor Component의 최적화 불가능 이슈
0
40
2
useCallback ⊂ useMemo
0
38
2
라이브러리 설치 질문
0
35
2
linter 질문
0
42
2
감정일기장 vercel 배포 후 새로 고침 시 404페이지가 뜨는 이유
0
43
2
Sort 메서드 관련 아티클
0
44
2
4.1) React.js를 소개합니다 강의를 듣고 궁금한 점이 생겼습니다.
0
46
2
html, body에 적용하는 css 스타일 질문입니다.
0
42
2
eslint.config.js 설정 질문입니다.
0
95
2
존재하지 않는 일기 url입력 시 alert이 두 번 떠요
0
70
1
교재(3쇄)와 강의 내용 문의
0
71
2
12.13) 하단 여백 스타일링 관련 질문 드립니다.
0
92
2
에러 질문드립니다
0
110
2
VSCode 설정 문의
0
144
2
PPT 코드 관련 질문
0
68
2
useEffect와 lifecycle문의
0
90
2
프론트엔드 학습 수준 문의
0
112
2
리액트 챕터별 코드에서 eslint 설정파일이 없어요
0
113
2
데이터 로딩중 화면만 계속 나와요!!
0
102
2
퍼블리셔일경우 어느정도 수준까지 강의를 들어야할까요
0
134
2
이후의 커리큘럼 문의
0
156
2
실슬환경 설정에서 save후 console.log 부분이 새로고침이 안되는현상입니다.
0
115
2
최적화 관련 질문있습니다 (useMemo 등)
0
134
3
프로바이더 컴포넌트의 위치는 어떤 기준인가요?
1
130
3