본문 바로가기
Programming/Frontend

[VueJs] component 에서 벗어날때 이벤트 처리하기

by BitSense 2020. 4. 26.
반응형

페이지 이동 전에 특정 이벤트를 처리하고 싶은 경우가 있는 경우 유용합니다.

// component LIFECYCLE
components: { ... },
mounted: { ... }
methods: { ... },
beforeRouteLeave (to, from, next) { ... } // 컴포넌트를 벗어나는 경우 처리할 이벤트

// 샘플
        beforeRouteLeave(to, from, next) {
            const answer = window.confirm('데이터 저장이 되지 않았습니다. 이 페이지를 나가시겠습니까?')
            if (answer) {
                next()
            } else {
                next(false) // false를 추가한 경우 페이지 이동을 하지 않음
            }
        }
반응형