Vue路由this.$router.push跳转页面不刷新
2020-08-18 本文已影响0人
哒哒哒哒da
一、背景
介绍：在vue项目开发中，使用路由进行页面跳转时，路由所跳转的页面不进行刷新。也就是vue生命周期函数没有执行(created、mounted钩子函数)。
案例：
A页面：
image
B页面：
image
问题：
当在A页面第一点击按钮到B页面时，一切正常，当返回到A页面再次点击按钮时，B页面没有执行mounted钩子函数，结果导致mounted函数中查询方法不执行。
二、解决方法：
1、使用activated:{}周期函数代替mounted:{}函数即可。
2、监听路由
// 不推荐、用户体验不好watch: { '$route' (to, from) { // 路由发生变化页面刷新 this.$router.go(0); }},
// 该方法会多一次请求watch: { '$route' (to, from) { // 在mounted函数执行的方法，放到该处 this.qBankId = globalVariable.questionBankId; this.qBankName = globalVariable.questionBankTitle; this.searchCharpter(); }},
三、相关博客
vue.js中created()与activated()的个人使用理解：
https://blog.csdn.net/qq_36608921/article/details/82216617
this.router.push()的差别：
https://blog.csdn.net/qq_36838191/article/details/80855120
vue-router3.0版本中 router.push 不能刷新页面的问题：
