Как добавить EventListener в VUE и иметь доступ к компонентам в этом. $ Refs - PullRequest
Новая
       54

Как добавить EventListener в VUE и иметь доступ к компонентам в этом. $ Refs

1 голос
/ 28 октября 2019

Структура моего корневого компонента выглядит примерно так 

<Header />
<router-view>
 <somecomponent>
   <component A ref="componentA" />
   <component B ref="componentB" />
 </somecomponent>
</router-view>
<Footer />

Я использую шину событий для связи между компонентами в заголовке и компонентами в представлении маршрутизатора согласно добавлению компонента вparent от child in vue

При получении события в некотором компоненте в просмотре маршрутизатора я хотел бы сделать что-то для компонента A. Через это. $ refs.componentA.

Я добавляюсписок событий для некоторого компонента, подобного этому: 

EventBus.$on("someevent", args => {
      this.onSomeEvent(args);
    });

и определите метод следующим образом: 

methods: {
    onSomeEvent(args) {
      this.$refs.componentA.doSomething();
    },

Это работает нормально, пока я не изменю страницу, а затем вернусь на страницу с некоторым компонентом. Затем я получаю сообщение об ошибке 

Error in event handler for "someEvent": "TypeError: this.$refs.componentA is undefined"
TypeError: "this.$refs.componentA is undefined"
    onSomeEvent somecomponent.vue

Но действие doSomething () все еще выполняется. Таким образом, как будто обработчик событий запускается дважды, и при первом запуске это. $ Refs.componentA не определено, где, как это определено при втором запуске.

Я пытался добавить Eventlistener 

EventBus.$on("someevent", args => {
          this.onSomeEvent(args);
        });

к некоторому компоненту, смонтированному и обновленному, но с тем же результатом.

Любые идеи, где я должен разместить EventListener, чтобы избежать ошибкивыше

...