Vue 刷新当前路由方法

问题描述:vue子组件上传图片,上传成功想刷新整个父组件。

解决方案:

一、一种方法,但是有bug

在网上看到了一种方法:试过之后感觉有bug。第一次刷新返回到上个界面了,第二次第三次有是正常的。

let NewPage = "_empty" + "?time=" + new Date().getTime() / 500;
this.$router.push(NewPage);
this.$router.go(-1);

Vue 刷新当前路由方法_第1张图片
整体意思是:图片上传成功后,先跳转到一个新界面,然后回退到当前界面。就实现了刷新。但实际应用似乎是有些问题

二、于是又找了一种方法

this.$router.replace({path: ‘/refresh’});
Vue 刷新当前路由方法_第2张图片

新建一个refresh.vue
// 空页面,负责中转到目标页面


 


from.path为需要刷新页面的地址。
为什么要用replace而不用push呢,因为push假如刷新成功后点返回会回到refresh页面,replace可以避免这个问题。
在router/index.js添加这个路由
Vue 刷新当前路由方法_第3张图片

{
        path: '/refresh', 
        name: 'refresh',
        component: () =>
            import('../view/my-online/refresh.vue'),
        meta: { title: '刷新界面' }
    },

就实现了当前界面的刷新工作。

你可能感兴趣的:(前端,vue学习笔记,vue)