-
질문 & 답변
카테고리
-
세부 분야
풀스택
-
해결 여부
미해결
state변화시 렌더링 질문
20.06.10 10:52 작성 조회수 160
1
let [SubscribeNumber,setSubscribeNumber]=useState(0)
let [Subscribed,setSubscribed] = useState(false);
//버튼 클릭시마다 실행되는 함수
if (Subscribed) {
Axios.post('/api/subscribe/removeFromSubscribe',subscribeVariable)
.then(response=>{
if (response.data.success) {
setSubscribeNumber(SubscribeNumber-1);
setSubscribed(!Subscribed);
} else {
alert('Fail at Remove Subscribe')
}
})
}
1.setSubscribeNumber와 setSubscribe를 통해 state 변화시
컴포넌트가 다시 렌더링된다고 알고 있는데여
그럼 이 경우는 setSubscribeNumber한 후 렌더링 =>
setSubscribe한 후 다시 렌더링하고 종료
그러니깐 버튼 클릭시마다 총 2번의 렌더링을 실행한다고 보면 될까요?
2. setSubscribeNumber실행시 state변화가 먼저 일어나고
렌더링이 일어나는지 혹은 변화되기 전의 state값으로 렌더링 후
state변화가 일어나는지 순서가 헷갈리는데 무엇이 맞을까요?
3. useEffect(callback, []) =>여기서 2번째 인자로 []를
넘기면 componentDidMount처럼 행동한다고 봤는데
실무에서도 이렇게 자주 사용하시나요?
항상 너무나 감사합니다.혼자 처음부터 만들어보려는데 쉽지 않네요.
이거 얼른 다하고 결제해놓은 쇼핑몰도 할 생각입니다.
답변을 작성해보세요.
2
John Ahn
지식공유자2020.06.13
안녕하세요 ~!!!
1. 네 맞습니다 ^^
2. 렌더링이 일어나려면 state이 변화가 있어야 하기 때문에 먼저 state이 변화가 일어난후 렌더링이 진행됩니다 ^^
3. 넵 ! 실무에서 Hook을 사용하고 있다면 많이 쓸수밖에 없습니다 ^^
그리고 만약 hello 라는 state이 있고 그 hello라는 state이 변할때 마다 해당하는 useEffect를 다시 사용하려면
[] 이곳안에 [hello] 이렇게 해주시면 됩니다 ~ !
수고하세요 ^^ ~ !
답변 1