Vue 사용시 브라우저가 뒤로 돌아갈 때 beforeRouteLeave가 실행되지 않는 문제

이 글에서는 Vue 브라우저가 돌아갈 때 beforeRouteLeave가 실행되지 않는 문제에 대한 해결책을 주로 소개합니다. 필요한 친구는 첫 번째 구성 요소를 로드하는

현상

을 참조할 수 있습니다. 브라우저 기록) 첫 번째 항목(이하 모니터링할 구성 요소라고 함)에서는 beforeRouteLeave가 트리거될 수 있으며 다른 페이지로 일반 점프할 수 있습니다. 그러나 브라우저의 뒤로 버튼을 누르면 이 이벤트를 들을 수 없습니다.

Solution

현재 상대적으로 투박하고 비실용적인 솔루션을 사용하고 있습니다. 모니터링할 구성 요소가 첫 번째 구성 요소가 아니고 beforeRouteLeave 이벤트를 정상적으로 수신할 수 있도록 구성 요소 계층을 추가한 다음 모니터링할 구성 요소에 router.push를 추가합니다.

참고:

원래 라우팅 방해로 인해. main.js에 전역 경로 모니터링을 추가해야 합니다

router.beforeEach((to, from, next) => {
 if (to is '用于跳转的组件' && from is '待监听组件') {
  router.go(-1) 
  next(false)
 } else {
  next()
 }
 // 这样当从一个普通页面A进入待监听组件时，在待监听组件中按返回键时能正常进入A
})

위 내용은 제가 모든 사람을 위해 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

JavaScript 관련 요령

webpack에서 동적으로 파일 가져오기 구현

WeChat 애플릿에서 원형 진행률 표시줄을 구현하는 방법

webpack에서 아이콘 글꼴을 사용하는 방법 글꼴 아이콘

지정된 JS 파일을 webpack에서 별도로 패키징하는 방법

vue 모바일 터미널에서 날짜 선택 구성 요소 구현

노드를 사용하여 내장 디버깅 구현

react webpack 패키지 파일(자세한 튜토리얼)

6가지 JavaScript 정규 표현식(자세한 튜토리얼)

Javascript에서 기본 아바타를 채우는 방법

webpack을 사용하여 지나치게 큰 Bundle.js 파일 문제를 처리하세요

node.js를 사용하면 다음을 구현합니다. Douyin의 자동 빨간 봉투 잡기 기능

vue-cli에서 babel 구성 파일을 구성하는 방법

babel 설치 및 구성 튜토리얼을 사용하는 방법

위 내용은 Vue 사용시 브라우저가 뒤로 돌아갈 때 beforeRouteLeave가 실행되지 않는 문제의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!