Vue监听浏览器前进后退物理返回键(浏览器自带的)
Vue监听浏览器前进后退物理返回键在某些需求下要监听用户物理按键。popstate事件只会在页面不跳转的情况下,路由发生变化触发。created() { // 创建vm实例后执行// 浏览器控制按钮前进后退触发函数window.addEventListener('popstate', this.popstate, false);},destroyed() { // 销毁vm组件// 避免堆栈溢出,
·
Vue监听浏览器前进后退物理返回键
- 在某些需求下要监听用户物理按键。
popstate
事件只会在页面不跳转的情况下,路由发生变化触发。
created() { // 创建vm实例后执行
// 浏览器控制按钮前进后退触发函数
window.addEventListener('popstate', this.popstate, false);
},
destroyed() { // 销毁vm组件
// 避免堆栈溢出,多次创建、多次触发
window.removeEventListener('popstate', this.popstate, false);
},
methods: {
popstate() {
console.log('发生跳转');
}
}
-
虽然这样就可以了,只用在
popstate
中写业务就行了。 -
但是还是要注意,如果不是在
keep-alive
中可以直接在destoryed()
中销毁,避免多次创建,多次调用。 -
如果是在
keep-alive
中的组件就在deactivated()
中销毁。
更多推荐
已为社区贡献2条内容
所有评论(0)