Selector unknown returned the root state when called. This can lead to unnecessary rerenders.
Selectors that return the entire state are almost certainly a mistake, as they will cause a rerender whenever *anything* in state changes.
회사에서 리액트로 개발하던 도중 항상 이 경고문이 신경쓰였다.
여기 온 사람들도 모두 나와 같은 생각일 것이다.
결론부터 말하자면,
const state = useSelector(state=>state);
위에 원인이 되었던 코드를
const Mode = useSelector(state=>state.Mode);
const country = useSelector(state=>state.country);
const small_bet = useSelector(state=>state.small_bet);
const max_bet = useSelector(state=>state.max_bet);
const id = useSelector(state=>state.id);
const money = useSelector(state=>state.money);
const LastWinMoney = useSelector(state=>state.LastWinMoney);
const IsEnd = useSelector(state=>state.IsEnd);
const TotalBettingMoney = useSelector(state=>state.TotalBettingMoney);
하나하나 변수명을 따로 지정해서 넣어주면 해결된다.
필자는 Redux를 쓸 때 state를 한꺼번에 가져와서 쓰면 편하다고 생각했지만,
{state.Mode==='2'&&<div className='GameLogo'></div>}
이렇게 하면 모든 state가 변경될때마다 쓸데없는 재렌더링이 일어난다고 한다(그렇게 크게 느려지진 않던데...).
{Mode==='2'&&<div className='GameLogo'></div>}
이렇게 바꿔서 다들 사용하자.
모든 변수명을 바꾸려니까 힘들긴 하지만 경고안나는거보니까 깔끔하긴 하다.
'리액트' 카테고리의 다른 글
이미지 로딩속도 높이기 (0) | 2024.02.14 |
---|---|
리액트 설치 A to Z (1) | 2024.01.24 |
React 반응형으로 창 크기 조절(비율 고정) (0) | 2024.01.18 |