[Discussion]Event handler(register by "v-on") cannot be unbound in vue3.

[parasol-tree]

How to unbind event handler(register by "v-on") in vue3?

Vue SFC Playground for example
The following code for example:

<template>
  <div ref="refDivDom" class="divDom" @mouseenter="mouseEnterFunc"></div>
  <button class="btn" type="button" @click="removeMouseEnter">removeMouseEnter</button>
  <p>{{message}}{{count}}</p>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const refDivDom = ref<HTMLDivElement>()
const message = ref('')
const count = ref(0)

const mouseEnterFunc = () => {
  message.value = 'mouseEnter'
  count.value++
  console.log('%c [ mouseEnter ]-16', 'font-size:14px; background:#2f79ce; color:#fff;')
}
const removeMouseEnter = () => {
  count.value = 0
  refDivDom.value?.removeEventListener('mouseenter', mouseEnterFunc) // unable to unbind event 'mouseenter'
  message.value = 'removeMouseenter()'
  console.log('%c [ removeMouseenter() ]-22', 'font-size:14px; background:#d0d; color:#fff;')
}
</script>

<style scoped>
.divDom {
  width: 60%;
  height: 200px;
  margin-bottom: 20px;
  background-color: skyblue;
}
.btn {
  padding: 4px 10px;
}
</style>

Although this situation can be solved by not using the "v-on" command but using "addEventListener", "removeEventListener" instead.
But still hope vue3 will add an API initiative to remove event listeners(register by "v-on") in the future.

[LinusBorg]

https://play.vuejs.org/#eNqFVO1um0AQfJUTUYSt2Nhxo1TBxP2Kq7ZK2qrNvxBVGBZ88XGHuIM4dXn37t05+KNW+seGmd252Vlg5bwrCq+uwPGdQEFesEjBJOSEBAmtSQnpZejg7xWtr0QeOiRmkZSIIWuBui+4f5eLSgJwBeW0xr97rDDQVEMfKx6HziQYYJPVnlVKCd6KzRRHJfVUgL4xHN6/jRmNF+b8XNRw0+qh1j4UDGyblS8mq1UOUkYZNM1qFYuKq6YJBgXSwWBrTLyVcUkLRSSoqiAs4hkeqCQeEXKaF6JUZKVjIA1JS5ETF7NydWMsuFSasdGQS30dfLq9uUZgyiDHGCad7nPh2o4t67huSxhza3iIaNuwEx8WdLrkckJWesC1mFdHrNKS7qYYvRGradmTEwtwKRh4TGQd9zgmd1vy5L5/eu72iJsKrvqS/gb/9KxYjsksihdZiVKJfzRKX1/EMEYhJkr/KE3TsR6h2XG72f86DevLwC75Q3jF2KSzDbYp7O9zd96teZAYamgw2GRvmTeeFTEGrqlUwKHcOa23F2pXq1Q8mjEgSuDVjPKEgBlgu89Evjtga0bPdHAlWxOZtk53vZr9TfxbiBsZjf63kWSYHFpHMLAP9PrhVk84m4xFAQkinn1rbaiPNFFzn5wPj8f6dg40myufjIZDPMqMFJUZ5f2ZwBcr18Qa37jo2/OJXDzNcGxk0YGHb7M9oYiShPLMJ2ienNp2a1HbQj9OD181TCSlmfcgBcePkGkMnVjkBWVQfisUxcRCx7eSmosYE49fDKbKCnrPeDyHeHEAf5BLjYXO9xIklDWETsspnBGUpac/v8ISr1syF0nFsPoF8gfgNivt0Za9x1TQ9ladcfvZfEkwi1s5XeKDKZ+H0kZ1ZWPqQwe/Lh9eGH1j95V3ZvowUUzxVw2l1sQAkfBGF07zF7IEARw=

[parasol-tree]

Wow, I forgot about dynamic event.
It's embarrassing.😅😅😅
Thank you so much.