일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- Python
- 마이바티스
- Spring
- docker
- github
- 스프링부트
- Winform
- machine-learning
- 자바
- 도커
- DataGridView
- MySQL
- 리액트
- springboot
- design pattern
- Kotlin
- Spring Boot
- 코틀린
- VOA
- AWS
- c#
- Java
- mybatis
- react
- git
- 파이썬
- 스프링
- kubernetes
- 리팩토링
- 쿠버네티스
Archives
- Today
- Total
보뇨 다이어리
setState 로 값이 변화할때 재렌더링막기 본문
반응형
컴포넌트가 재렌더링 되는 조건은 props 가 들어올때, state 값이 바뀔때, 또 뭔가 있었는데...무튼 이런경우에 재렌더링이 발생함.
근데 별상관없는 값이 변경되었는데도 계속 재렌더링이 발생하니깐 뭔가 꼴보기싫음;
찾아보니 애초에 setState 메소드를 실행시키면 이후에 재렌더링이 발생한다고하는데...역시나 막는 방법은 존재한다
그게 바로 useMemo
를 사용하는건데 jsx
값은 같기떄문에 값을 저장하여 보여주는(vue 에서 computed
랑 비슷한 느낌..)것이당!
...
const mainContext = useMemo(() => {
return (
<div>
{ check ? (
<div>
{results.map((result, index) => (
<div key={index}>
<p>{result.name}</p>
<p>{result.url}</p>
</div>
))}
</div>) : (
<div>
Loading...
</div>
)}
</div>
)
}, [results, check])
return mainContext;
출처
반응형
'프론트엔드 > React 정보' 카테고리의 다른 글
focus input on page loading (0) | 2020.09.02 |
---|---|
React Router - useRouteMatch 에 대해 (0) | 2020.08.16 |
export default 사용할때 주의할점 (0) | 2018.09.27 |
parcel 프로젝트 빌드시 Unexpected token 에러 (0) | 2018.09.17 |
정규식 완전 정리 (0) | 2018.09.04 |