vue3中 子组件通过emit抛出事件(proxy.$emit),出现如下警告但不影响使用:
Extraneous non-emits event listeners (addSuccess) were passed to component but could not be automatically inherited because component renders fragment or text root nodes. If the listener is intended to be a component custom event listener only, declare it using the "emits" option.
解决方法,需要在emits中定义抛出的事件名:
<template> <input type="text" :value="name" @input="$emit('update:name', $event.target.value)"> <input type="text" :value="title" @input="$emit('update:title', $event.target.value)"> <input type="text" @input="$emit('otherev', $event.target.value)"> </template> <script> export default { props: { name: String, title: String }, // 定义抛出的事件名称 emits: ["update:name", 'update:title'] } </script>
setup语法糖,那么就不能这么使用emit了,需要引入defineEmits:
<script setup name="addSubsidyReceiver"> import { addSubsidyReceiver,listVillageBank } from "@/api/wm/subsidyReceiver"; import {ref, watch} from "vue"; import { defineEmits } from 'vue' // 定义抛出的事件名称 const emit = defineEmits(["addSuccess","update:modelValue"]) ...... //proxy.$emit("addSuccess");要用下面方法抛出事件 emit("addSuccess"); ...... </script>
0条评论
点击登录参与评论