Vue EventBus не будет передавать атрибуты объекта - PullRequest
Новая
       13

Vue EventBus не будет передавать атрибуты объекта

0 голосов
/ 24 августа 2018

Буду признателен за помощь с двумя компонентами Vue Single Page.

Компонент «Панель поиска» содержит диалог для ввода данных пользователем.Эти пользовательские данные необходимы в компоненте ResultList для дальнейшего использования.Поэтому я хочу использовать Vue EventBus для передачи.

Пользовательский ввод является объектом с двумя атрибутами: 

userInput: {
    userName: '',
    taskNr: ''
  },

и должен быть передан в ResultList с помощью EventBus: 

emitUserInput: function () {
  EventBus.$emit('emitUserInput', this.userInput)
}

в ResultList - это метод слушателя, который должен хранить объект в компоненте data-Object: 

userInputListener: function () {
  EventBus.$on('emitUserInput', setUser => {
    this.userInput.userName = $userInput.userName
    this.userInput.taskNr = $userInput.taskNr
  })
}

К сожалению, внутри userInput-объекта ResultList нет изменений.,Его атрибуты userName и taskNr остаются пустыми. Строки.

Я был бы рад любым идеям.Заранее спасибо!

Обновление

Вот код, вызывающий 'emitUserInput ()' в компоненте "Панель поиска" 

<el-form-item>
      <el-button @click='emitUserInput(), toggleInputForm = false'>Bestätigen</el-button>
</el-form-item>

А вот иобъект данных в компоненте «Панель поиска»: 

data () {
  return {
    userInput: {
      userName: '',
      taskNr: ''
  } 
}

1 Ответ

0 голосов
/ 24 августа 2018

Куда вы звоните userInputListener? Вы можете вставить EventBus.$on в свой mounted() крючок и посмотреть, работает ли он: 

mounted() {
  EventBus.$on('emitUserInput', payload => {
    this.userInput.userName = payload.userName
    this.userInput.taskNr = payload.taskNr
  })
}
...