Vue页面刷新解决方法

一、问题

点击编辑对话框，修改内容，弹出修改信息成功

再点击新增对话框，仍然弹出修改信息成功

二、解决方法

1、在App.vue中添加以下内容

<template>
  <div id="app">
    <router-view v-if="isRouterAlive" />
  </div>
</template>

<script>
export default {
  name: 'App',
  provide () {    //父组件中通过provide来提供变量，在子组件中通过inject来注入变量。
    return {
      reload: this.reload
    }
  },
  data() {
    return{
      isRouterAlive: true    //控制视图是否显示的变量
    }
  },
  methods: {
    reload () {
      this.isRouterAlive = false;    //先关闭，
      this.$nextTick(function () {
        this.isRouterAlive = true;   //再打开
      })
    }
  },
}
</script>

2、引用

<script>
export default {

  //引入
  inject: ['reload'],
  
  data() {
    return {
    ...
    },
  },
  create() {
  ...
  },
  methods: {
     Update() { 
     
     //调用刷新页面
     this.reload()
     
     })
   },
}
</script>