The problem that beforeRouteLeave cannot be triggered when the browser goes back when using Vue

This article mainly introduces the solution to the problem that Vue browser cannot trigger beforeRouteLeave when backing up. Friends in need can refer to the

phenomenon

When loading the first component (the first one here means the first one in the browser history, later referred to as the component to be monitored), beforeRouteLeave can be triggered by normal jumps to other pages. However, this event cannot be listened to when pressing the browser's back button.

Solution

Currently, a relatively crude and impractical solution is used. Add a layer of components, and then router.push to the component to be monitored, so that the component to be monitored is not the first component and can listen to the beforeRouteLeave event normally.

Note:

Due to disrupting the original routing. You need to add global route monitoring in main.js

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

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

Tricks related to JavaScript

Implementing dynamically imported files in webpack

How to implement a circular progress bar in WeChat applet

How to use iconfont font icon in webpack

In webpack How to package specified JS files separately in

Implement date selection component in vue mobile terminal

Use node to implement built-in debugging

React webpack packaged files (detailed tutorial)

6 kinds of regular expressions in JavaScript (detailed tutorial)

How to fill in the default avatar in javascript

Use webpack to handle the problem of excessively large bundle.js files

Use node.js Implement the function of automatically grabbing red envelopes on Douyin

How to configure the babel configuration file in vue-cli

How to use babel installation and configuration tutorial

The above is the detailed content of The problem that beforeRouteLeave cannot be triggered when the browser goes back when using Vue. For more information, please follow other related articles on the PHP Chinese website!