'v-on' directives require a value or verb modifier (like 'stop' or 'prevent')

I created two files named Tasks.vue and Task.vue. I emit an action from Task.vue named 'delete-task', and I want to emit it again in Tasks.vue using @delete-task

eslint-plugin-vue gives me the following error:

'v-on' directives require a value or verb modifier (like 'stop' or 'prevent'

Tasks.vue

<template>
  <div class="tasks-container">
    <div v-for="task in tasks" :key="task.id">
      <Task @delete-task:"$emit('delete-task', task.id)" :task="task" />
    </div>
  </div>
</template>

<script>
import Task from "./Task.vue";
export default {
  name: "Tasks",
  props: {
    tasks: Array,
  },
  components: {
    Task,
  },
  emits: ['delete-task']
};
</script>

Task.vue

<template>
  <div :class="[task.reminder ? 'reminder' : '', 'task']">
    <h3>
      {{ task.text }}
      <i @click="onDelete(task.id)" class="fa fa-times"></i>
    </h3>
    <p>{{ task.day }}</p>
  </div>
</template>
<script>
export default {
  name: "Task",
  props: {
    task: Object,
  },
  methods: {
    onDelete(id) {
      this.$emit('delete-task', id)
    },
  },
};
</script>

Why do I need a 'stop' or 'prevent' modifier?