Блог

Главная - Вопросы по программированию - VueJS передает компоненту, но с ошибкой не может прочитать свойство apply

VueJS передает компоненту, но с ошибкой не может прочитать свойство apply

#vue.js #events

#vue.js #Мероприятия

Вопрос:

У меня такая структура компонента:

 /parent
  /childA
  /childB

Я хотел бы отправить сообщение от childA childB кому, поэтому в childA компоненте VueJS я выдаю событие, подобное этому:

 this.$root.$emit('message', 'hello')

В childB компоненте я регистрирую слушателя следующим образом:

   mounted() {
    this.$root.$on('message', (arg) => {
      console.log('message: ' arg)
    })
  }

Когда событие запускается (при взаимодействии с пользователем), childA я вижу это в консоли:

 [Vue warn]: Error in event handler for "message": "TypeError: Cannot read property 'apply' of undefined"

TypeError: Cannot read property 'apply' of undefined

message: 
(3) message: hello

Это (3) число 3 , обведенное кружком, указывающее (я полагаю), что то же console.log самое произошло 3 раза.

Почему эти ошибки возникают при успешной очистке события?

Если это поможет, я получил свой код из этого среднего сообщения.

Ответ №1:

Попробуйте это:

Для эмиссии в вашем компоненте:

 this.$emit('message', 'hello')

И в вашем родительском компоненте вам не нужно создавать прослушиватель в ‘mounted ()’. просто в вашем разделе шаблона вызовите метод для этого события следующим образом:

 <component @message="showMessage"/>

Затем создайте метод, подобный этому:

 methods: {
  showMessage (message) {
    console.log(message)
  }
}

Комментарии:

1. Я не слушаю родительский или дочерний компонент. Это два отдельных компонента. Они оба находятся в одном и том же родительском компоненте, но они не находятся в отношениях / структуре родитель / потомок.

2. Я обновил свой пост, чтобы немного подробнее описать структуру компонентов.

3. В этом случае вам необходимо использовать EventBus. С помощью EventBus вы можете вызвать событие в любом месте и обработать его в любом месте. Просмотрите эту статью, чтобы узнать, как использовать EventBus: digitalocean.com/community/tutorials/vuejs-global-event-bus

4. В моем случае это не работает. У меня событие запускается из обработчика axios.