推薦使用provide/inject組合實現重新整理的原因在於重新整理頁面的不會出現瞬間的空白頁面，使用者體驗良好。

　　1、修改App.vue頁面

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

<script>
export default {
  name: 'App',
  provide () {
    return {
      reload: this.reload
    }
  },
  data () {
    
 
return {
      isRouterActive: true
    }
  },
  methods: {
    /**
     * 重新渲染頁面
     * @date 2021-07-30
     */
    reload () {
      this.isRouterActive = false
      this.$nextTick(() => {
        this.isRouterActive = true
      })
    }
  }
}
</script>

　　2、在需要重新整理的頁面注入在App.vue提供(provide)的reload依賴，直接使用this.reload來重新整理。

import {
    getDetails
} from '@/api/order'
export default {
  name: 'ShoppingDetails',
  provide: ['reload'],
  data() {
    return {}
  },
  watch: {
    $route() {
      if (this.$router.query.id) {
        this.getData(this.$router.query.id)
      }
    }
  },
  mounted() {
    this.handleData(this.$router.query.id)
  },
  methods: {
    /**
     * 獲取資料
     * @date 2021-07-23
     * @param {Object} data
     */
    getData(id) {
       getDetails(id).then((res) => {
          if (res.code === 200) {
             this.list = res.data.list
             this.reload()
          }
       })
    }
  }
}