9. 在<script setup>语法中使用emit

方法1

先定义 emit 再调用

<script setup>
const emit = defineEmits(['eventA', 'eventB'])
function btnClick(params) {
    emit('eventA')
    emit('eventB', params)
}
</script>

方法2

使用 useContext

<template>
  <button @click="action('🎉')</button>
  <!-- emit is defined through useContext -->
  <button @click="emit('action1','🥑')">1</button>
  <!-- $emit here doesn't need to be defined -->
  <button @click="$emit('action2','🦄')">2</button>
</template>
<script setup>
  import { useContext } from 'vue'
  const { emit } = useContext()
  const action = (id) => emit('action', id);
</script>

方法3

使用

<script setup>
  import { getCurrentInstance} from 'vue'
  const {emit} = getCurrentInstance()
</script>

参考