Передача данных от дочернего к родительскому компоненту с событием клика (данными) во Vue

Мне нужно передать данные (слаг) от кнопки @click в функцию с событием $ emit, а затем в родительском компоненте получить это и встроить в другой компонент в качестве опоры, чтобы загрузить простой объект.

Это мой подход, но не сработал

‹- Дочерний компонент (Conversaciones.vue) ->

  <template v-slot:title>
     <q-btn @click="SlugHijoPadre(conversacion.slug)">
     {{ conversacion.contenido }}
     </q-btn>
  </template>

  methods:{ 
    SlugHijoPadre(Slugdata) {
       this.$emit("enviar-conversacion", {
       slug: Slugdata 
  })}}

‹- Родительский компонент ->

  <Conversaciones @enviar-conversacion="slugConversacion"/>

  components: {
    Conversaciones,
    Conversacion
  },

  data() {
    return {
      slugs: {}
    };
  },

  methods: {

    slugConversacion(slug){
      this.slugs.push (slug);
      console.log(slug);
    }
  },

//And finally pass a property to call an especific object of another component:

  <Conversacion :slug="slugs"></Conversacion>


person Guido Bessone    schedule 20.01.2020    source источник


Ответы (1)


Проверьте свое свойство slugs, это объект, а не массив, поэтому вы не можете использовать this.slugs.push. Измените его на slugs: []

person Nipun Jain    schedule 20.01.2020
comment
Я просто изменил это и изменил этот объект Conversacion v-for = в slugs: key = object.slug: slug = object.slug ›‹/Conversacion›, чтобы выполнить итерацию в объекте и передать в api slug. И работает! Благодарность! - person Guido Bessone; 20.01.2020