vueナビゲーションメニューのリフレッシュページの再ロード

Knowledge Baseプロジェクトナビゲーションメニューバーをクリックサブメニューをクリックしてページをリフレッシュする必要があります
アプリケーションvueは、現在のページ内でルーティングパラメータが変化し、ページリフレッシュをどのように行うかを示します.
伝統的な方法location.reload(); ページ全体をリフレッシュすると、白い画面が表示され、体験が悪いです.router.go(0); 同じように、体験が友好的ではない.
推奨方法provide/injectの組合せ原理を使用します.コンポーネントの階層がどれだけ深くても、上下流関係が成立する時間内に常に有効になるように、祖先コンポーネントが子孫子孫に依存を注入することを許可します.
provide:オブジェクトまたはオブジェクト関数を返すinject:文字列配列、またはオブジェクト.オブジェクトのkeyはローカルのバインド名
 
ルーティング配布の変更

//  app.vue                v-if="isRouterAlive"



export default {
    name: 'app',
    //               （               /  ）
    provide() {
        return{
            reload: this.reload
        }
    },
    data() {
        return{
            isRouterAlive: true
        }
    },
    methods: {
        //        
        reload () {
            this.isRouterAlive = false;
          this.$nextTick(function () {
              this.isRouterAlive = true
          })
          }
    },
}

サイドメニューバーのコード部分に次のコードを追加

//       handleselect  



export default {
    inject: ['reload'],  //        （    ）
    //  
    watch: {
       //           ，         
       '$route': function(){
            // this.reload();
        }
    },
    methods: {
        handleselect: function (a, b) {
            this.reload()  //            
        },
    }
}