相關網址： https://www.cnblogs.com/yinn/p/9056731.html

1.場景

在處理列表時，常常有刪除一條資料或者新增資料之後需要重新重新整理當前頁面的需求。

2.遇到的問題

1. 用vue-router重新路由到當前頁面，頁面是不進行重新整理的

2.採用window.reload()，或者router.go(0)重新整理時，整個瀏覽器進行了重新載入，閃爍，體驗不好

3.解決方法

provide / inject 組合

作用：允許一個祖先元件向其所有子孫後代注入一個依賴，不論元件層次有多深，並在起上下游關係成立的時間裡始終生效。

我的專案配置： 

①home.vue

<router-view v-if="isReloadAlive"></router-view>

<router-view v-if="isReloadAlive"></router-view>

export default {
    provide() {
         return {
             reload: this.reload
         }
    },
    data(){
        isReloadAlive : true
    },
    methods: {
        reload() {
			this.isReloadAlive = false;
			this.$nextTick(function(){
				this.isReloadAlive = true;
			})
		}
    }
}

 

②使用reload方法的頁面

 內容管理 - 投顧推薦  tgtj.vue 

export default {
    inject: ['reload'],     // 注入 reload 方法
    data(){
        。。。。
    },
    method: {
        set: function(id){
             let param = {
                  "recommendedConsultant.id": this.recommendedConsultant_id,
                   "recommendedConsultant.sequence": this.recommendedConsultant_sequence,
                   "recommendedConsultant.consultant_id": id
              }
              setRecommendedAdvisor(param).then((data) => {
                   this.$message({ message: data.ret.retMsg });
                   if(data.ret.succeed){
                       this.reload()           // 呼叫重新整理方法
                   }
              });
        }
    }
}