使用 Vue 中的单击事件（数据）将数据从子组件传递到父组件

Question

我需要将数据（一个 slug）从 @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>

Answer 1

检查你的 slugs 属性，它是一个对象而不是数组，所以你不能使用 this.slugs.push。将其更改为 slugs: []

使用 Vue 中的单击事件（数据）将数据从子组件传递到父组件

Pass data from child to parent component with click event(data) in Vue

parent-child

emit

vue.js

vue-component