Vue刷新当前页的方式:
第一种:
直接刷新,利用路由方式重新跳转到当前页:this.$router.push({path: ‘/你的当前Vue文件名’});
例如:刷新 feedback_success.vue 文件
this.$router.push({path: '/feedback_success'});
第二种:
新建一个刷新页面的组件,在需要刷新的页面引入组件
App.vue修改配文件
<template>
<div id="app">
<router-view v-if="isRouterAlive"></router-view>
</div>
</template>
<script>
export default {
name: 'App',
//父组件中通过provide来提供变量,在子组件中通过inject来注入变量。
provide () {
return {
reload: this.reload
}
},
data() {
return{
isRouterAlive: true //控制视图是否显示的变量
}
},
methods: {
reload () {
this.isRouterAlive = false; //先关闭,
this.$nextTick(function () {
this.isRouterAlive = true; //再打开
})
}
}
}
</script>
刷新的页面应用
export default {
name: 'ProductDetail',
// 注入App里的reload方法
inject:['reload'],
},
methods{
this.reload();
}
示例:
App.vue文件
刷新的页面文件,例如 :feedback_success.vue 文件
具体原因知识 简单介绍
provide /injext
provide: 选项应该是一个对象或者返回一个对象的函数。 该对象包含可注入其子孙的属性。
inject : 一个字符串数组或者一个对象,对象的 key 是本地的绑定名
提示:provide和inject绑定并不是可响应的。这是刻意为之的。如果你传入了一个可监听的对象,那么其对象的属性还是可响应的。