Vue 어떻게 우아 하 게 타이머 제거
2567 단어 Vue깨끗이 제거 하 다타이머
타이머 지우 기,상당 수 사람들 이 이렇게 썼 을 거 라 고 믿 습 니 다:
export default {
data() {
reurn {
timer: null
}
},
mounted() {
this.timer = setInterval(() => {
console.log('setInterval')
}, 2000)
},
beforeDestroy() {
clearInterval(this.timer)
}
}
직접 코드 올 리 기:
export default {
data() {
reurn {
}
},
mounted() {
let timer = setInterval(() => {
console.log('setInterval')
}, 2000)
this.$once('hook:beforeDestroy', () => {
clearInterval(timer)
timer = null
})
}
}
파생 문제:beforeDestroy 가 촉발 되 지 않 았 습 니까?
배경 시스템 에서 우 리 는 페이지 캐 시 를 자주 설정 합 니 다.경로 가 keep-alive 캐 시 에 있 을 때 beforeDestroy 의 생명 주 기 를 가지 않 기 때문에 일부 동료 들 은 beforeDestroy 에서 타 이 머 를 지우 면 끝 날 것 이 라 고 생각 하고 심지어 검사 도 하지 않 았 습 니 다.실제로 타 이 머 는 제거 되 지 않 았 습 니 다.이 유 를 알 면 해결 할 수 있 습 니 다.activated 와 deactivated 라 는 두 개의 생 갈 고 리 를 통 해:
export default {
data() {
reurn {
}
},
mounted() {
let timer = setInterval(() => {
console.log('setInterval')
}, 2000)
this.$on('hook:activated', () => {
if (timer === null) { //
timer = setInterval(() => {
console.log('setInterval')
}, 2000)
}
})
this.$on('hook:deactivated', () => {
clearInterval(timer)
timer = null
})
}
}
Vue 가 어떻게 우아 하 게 타 이 머 를 지 우 는 지 에 관 한 이 글 은 여기까지 소개 되 었 습 니 다.더 많은 Vue 타 이 머 를 지 우 는 내용 은 예전 의 글 을 검색 하거나 아래 의 관련 글 을 계속 찾 아 보 세 요.앞으로 도 많은 응원 부 탁 드 리 겠 습 니 다!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Vue Render 함수로 DOM 노드 코드 인스턴스 만들기render에서createElement 함수를 사용하여 DOM 노드를 만드는 것은 직관적이지 않지만 일부 독립 구성 요소의 디자인에서 특수한 수요를 충족시킬 수 있습니다.간단한 렌더링 예는 다음과 같습니다. 또한 v...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
