vue3子组件触发父组件方法

子组件
<template>
	<div @click="confirm ">啦啦啦啦</div>
</template>
<script setup>
import { defineEmits } from 'vue'
const emit = defineEmits(['editConfirm'])
const confirm = () => {
    emit('editConfirm', '要传递的数据')  // 之前子组件修改父组件的数据时需要添加'update:editConfirm',但是触发父组件的方法不能加'update'
}
</script>


或
子组件
<template>
	<div @click="$emit('editConfirm', '要传递的数据')">啦啦啦啦</div>
</template>


父组件
<template>
<child @editConfirm="editConfirm"></child>
</template>
<script setup>
import child from './child.vue'
const editConfirm = (val) => {
  console.log(val)
}
</script>

父组件

 <import-dialog
   v-model="importVisible"
   :importTableData="importTableData"
   @confirm="importConfirm"
   @cancle="importCancel"
 />
const importConfirm = async (data) => {}

子组件
const emit = defineEmits(['confirm', 'cancle', 'update:modelValue', 'update:importTableData'])
emit('confirm', tableData.value)


你可能感兴趣的:(vue3,vue.js,前端,javascript)