【Vue/Nuxt.js】使用Composition API实现子组件向父组件传递数据的方法

使用defineEmits进行定义。

在Composition API中，我们可以创建一个emit的变量，并使用defineEmits定义自定义事件。

• 子组件

<script setup>
const emit = defineEmits(['hogeEvent']); //emit之外也可以
const hoge = () =>{
    emit('hogeEvent');
}
</script>
<template>
    <button type="button" @click="hoge">emit测试</button>
</template>

• 父组件

父组件只需要在定义的自定义事件名称中编写处理程序即可。

<script setup>
const customEvent = () =>{
  console.log('test')
}
</script>
<template>
  <ChildComponents @hogeEvent="customEvent"></ChildComponents>
</template>