VUEピットの旅--eventBusイベントバスの基本的な使用と繰り返しトリガイベント問題の解決

単一ページアプリケーションでは、Aページでイベントをトリガーし、Bページでこのイベントに応答するのが一般的なニーズですが、このようなニーズがある場合はどのように実現しますか.2つのシナリオが実現できる:1.vuexステータス管理を使用して、イベントがトリガーされるとvuexのステータスを変更し、応答イベントが必要な場所でwatchでこのステータスを監視し、ステータスが変更されるとイベントに応答します.2.eventBusイベントバスを使用して、イベントがトリガーされると、応答が必要な場所でこの通知を受信し、イベントに応答する通知を送信します.
方案は使用するのが少し複雑で、一部のものもよく処理しないで、総合的に考えてやはり方案の2を採用して、方案の2は比較的に正常な考え方に合って、使うのも比較的に便利です.
きほんしよう
公式ドキュメントではeventbusの紹介が簡単で、基本的には一筆書きですが、ここでは基本的な使い方を説明します.
EventBusの作成

//     js   ，              eventbus，  ，      
import Vue from 'vue'

export default new Vue;

メールでjsにeventbusをインポートし、vueのプロトタイプにマウントすると、グローバル呼び出しが可能になります.

import bus from './utils/eventBus'

Vue.prototype.bus = bus;

イベントの送信
イベントがトリガーされた場所でイベントを送信

this.bus.$emit(this.$route.path);

$emit()は、stringタイプのイベント名が必要です.ここでは、現在のルーティングのpathをイベント名として使用します.
イベントの受信
イベントはすでに送信されており、次にイベントを受信する必要がある場所でこのイベントを受信し、イベントに応答すればよい.

        this.bus.$on(this.$route.path,()=>{
                this.getData();
            })

イベントを受信するときも同じイベント名が必要で、イベント応答のために関数が必要です.ここでは、データを取得するインタフェースを呼び出します.
これにより,イベント全体が送信から受信および応答に至るまで完了するのは簡単ではない.
イベントが繰り返しトリガーされる問題
穴1
楽しそうに游ぶ准备をしていると、何か変なことがあったようで、どのようなイベントが缲り返しトリガーされたのか、ルートを切り替えるたびにイベントの実行回数が1つ増えるのか、どうすればいいのか、ユーザーが非常に频繁にページを切り替えると、イベントの実行回数はますます多くなり、最后に爆発するわけではありません.
検索してやっと理由が見つかりました.これは、コンポーネントの破棄に伴って自動的にログアウトされないため、ログアウト方法を手動で呼び出す必要があるためです.問題の原因が分かれば、コンポーネントのbeforeDestroy、またはdestroyライフサイクルでログアウト方法を実行し、イベントを手動でログアウトできます.

        beforeDestroy() {
            //           。              
            this.bus.$off(this.$route.path);
        },

これにより、イベントのログアウト操作が完了し、現在のイベントをログアウトできます.
坑二
これでいいと思ってるのか、NO、NO、NO.ライフサイクルでイベントをログアウトしましたが、イベントが複数回実行されることに気づきました.問題は依然として発生しています.それはなぜですか.ログを印刷したところ、イベント名に問題があることがわかりました.これは私が使っているためです.route.pathはイベント名として、ログアウトするときも当然だと思います.r o u t e . p a t hはイベント名として、ログアウト時にも当然t h i sを使いたい.toure.pathはログアウトイベント名として使用されます.ログを見てみると、beforeDestroyでは、this.$route.pathは、私たちがイベントを送信して応答するときのルーティングではなく、ページをジャンプするルーティングです.
これがライフサイクルの問題ですbeforeDestroyとdestroyのライフサイクルではthis.$route.pathが取得したのは実は次のページのpathで、この点に注意すれば、問題は解決できます.ソリューションも簡単です.現在のページに現在のルーティングを1つの変数で保存し、この変数をイベント名としてイベントをログアウトすればいいです.