0
필자는 상태에 따라 스타일을 조건부로 통과합니다. 그렇지 않으면 전이가 발생하지 않기 때문에 구성 요소가 렌더링 된 후 변환을 적용하려고합니다. 이를 달성하는 가장 좋은 방법은 setTimeout에 의한 것이라고 들었지만, 어떻게 함수의 반환을 타임 아웃 할 수 있습니까?함수 반환시 SetTimeout?
style= {
transition: 'transform 1s',
...this.zoomedIn && this.mobileZoom(i),
}
zoomedIn() {
return ['zoomIn', 'addBg', 'zoom', 'removeBg'].includes(this.state.zoom)
}
mobileZoom() {
const transform = this.state.transform.mobile
if (window.innerWidth < 600) {
return {
zIndex: 1070,
transform: 'translateY(' + transform.offset + 'px) scale(' + transform.scale + ')'
}
}
}
약간의 혼란, 당신은 당신이 후에 함수를 실행하려는 의미 DOM 요소가 렌더링됩니까? – bugfroggy
'어떻게 함수의 반환을 타임 아웃 할 수 있습니까? '반환 값을 타임 아웃 할 수 없습니다. 'setTimeout'은 끝 상태이고 그 안에 처리되는 것은 무엇이든 처리합니다. _later_ -'return'을 넣으면 _later_를 실행하여 어떤 값을 생성 한 다음 아무것도 아닌 것으로 가비지 컬렉션의 신에게 희생시킵니다 그것을 집어 들었다. 당신이 할 수있는 것은 약속이 성취되었을 때 약속을 지키고 행동하는 것입니다. 예를 들어,'setTimeout' 접촉의 코드가 무언가 독립적이기 때문에 값을 "픽업"하는 다른 것에 의존하지 않습니다. – vlaz
React에 대해 많이 알지는 못하지만 Angular와 비슷한 구성 요소 수명주기가 "onInit"과 동등한 것으로 가정하고 예상 한 작동이 트리거되는지 확인합니다. 자식 구성 요소 인 경우 "onChildrenRender"또는 뭔가가있을 수 있습니다. 또는 렌더링 된 광고문에서 부모에게 이벤트를 전달하여 자녀가 준비되었음을 알릴 수는 있지만 다시는 필요하지 않을 수 있습니다. 나는 이런 종류의 타이머를 사용하는 것이 위험하다는 것을 발견했다. React가 이에 대한 강력한 구성 요소 라이프 사이클을 갖고 있지 않다면 놀랄 것입니다. –