Replacement of "emit" method in Vue

Question

When I use "emit", Vue complains that I'm looking for a functionally equivalent alternative

This will be a to-do list

Code:

Button

Warning in browser console:

runtime-core.esm-bundler.js?5c40:38 [Vue warn]: An unrelated non-emitted event listener (deleteTodoEvent) was passed to the component but cannot be automatically inherited because the component renders a fragment or text root node . If the listener is to be used only as a component custom event listener, declare it using the "emis" option. at > at

Answer 1

You appear to be using Vue 3. The warning tells you that the event is not declared before it is used in the component. Here is an example:

export default {
  name: "YourComponent",
  emits: ["deleteTodoEvent"], // <--- this is what the warning in hinting to
  setup(_,{ emit }) {
    ...
  },
};