【问题标题】:Pass data from child to parent component with click event(data) in Vue在Vue中使用点击事件(数据)将数据从子组件传递到父组件
【发布时间】:2020-05-06 01:32:42
【问题描述】:

我需要将数据(一个 slug)从一个 @click 按钮传递给一个带有 $emit 事件的函数,然后在父组件中接收这个并作为道具嵌入另一个组件中,以加载一个简单的对象。

这是我的方法,但没有奏效

  <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>

【问题讨论】:

    标签: vue.js vue-component parent-child emit


    【解决方案1】:

    检查您的slugs 属性,它是一个对象而不是数组,因此您不能使用this.slugs.push。改成slugs: []

    【讨论】:

    • 我刚改成这个,修改这个 "Conversacion v-for="object in slugs" :key="object.slug" :slug="object.slug">"迭代对象并将一个 slug 传递给 api。并且有效!谢谢!
    猜你喜欢
    • 2017-10-20
    • 2020-09-25
    • 2020-12-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-03-18
    • 2019-07-12
    相关资源
    最近更新 更多