将数据从子组件传递到父组件时，Vue 事件不起作用答案

【问题标题】：Vue event does not work while passing data from child to parent component将数据从子组件传递到父组件时，Vue 事件不起作用
【发布时间】：2020-12-09 20:55:44
【问题描述】：

这是 Jobs 子组件向父组件发出事件。

<div class="card py-1 my-1" @click="$emit('active-job', job.id, job.slug)"></div>

接受事件的父组件

<div class="col-md-4 jobs-container py-2 px-1 ml-5">
  <jobs :active-job="jobChange"></jobs>
</div>

export default {

    components: {
        FilterNavigation,
        Job,
        Jobs
    },

    data() {
        return {
            selected: false,
        }
    },

    methods: {
        jobChange(id, slug) {
            console.log(id, slug);
        }
    }
}

当点击 div 时，事件会在子组件中发出，但不会越过父组件（不记录任何内容）。

【问题讨论】：

事件的简写是@active-job。您正在使用 v-bind 的简写
@active-job="jobChange" ，顺便谢谢。
应该做，假设一切都好

标签： vue.js vue-component custom-events

【解决方案1】：

您正在将 prop active-job 传递给子组件，而不是监听任何事件

你需要监听事件：

<div class="col-md-4 jobs-container py-2 px-1 ml-5">
  <jobs @active-job="jobChange"></jobs>
</div>

【讨论】：