본문 바로가기
카테고리 없음

vue 팝업 종료,subscribeAction 사용시 팝업 종료해도 지속작동함. beforeDestory() 로 제거해줘야함. 예시

by 향유 2023. 2. 28.

Vue.js의 mounted 라이프사이클 훅은 컴포넌트가 화면에 마운트된 후에 호출됩니다. 따라서 모달이 닫혀도 컴포넌트가 마운트된 상태에서는 mounted 훅이 호출될 수 있습니다.

모달이 닫힌 후에 컴포넌트의 라이프사이클 훅이 더 이상 호출되지 않도록 하려면, beforeDestroy 라이프사이클 훅에서 해당 컴포넌트에서 사용한 리소스들을 해제하고 이벤트 리스너 등을 제거해주면 됩니다.

 

 

 

    mounted(){
        const me = this;

        me.unsubscribe = me.$store.subscribeAction({
			after: (action, state) => {
                switch(action.type){
                    case 'kioskStore/IDLE_INCREASE':
						if(me.maxIdleTime == me.remainIdleTime){
							me.close(false);
						}
					break;
				}
			}
        })		
    },
	beforeDestroy(){
		const me = this;

		me.unsubscribe();		
	},

댓글