Unclear/misleading rules for prop/event name conversion
Vue version
3.2.45
Link to minimal reproduction
https://kasheftin.github.io/vue3-prop-name-conversion/
Steps to reproduce
Here's the repo: https://github.com/Kasheftin/vue3-prop-name-conversion/blob/master/src/App.vue
If an event is specified in kebab-case (like :on-some-event
), it does not work.
What is expected?
The regular props in both vue2 and vue3 can be defined both in kebab case and in camel case, :some-prop
works as well as :someProp
. Prop name is auto converted to camel case. It's expected that an event, defined in a form of a prop, :on-some-event
, should be auto converted to :onSomeEvent as well. But it does not happen.
What is actually happening?
if an event is defined in a form of a prop, :on-some-event
, then it's not possible to trigger it using $emit('..anything..')
.
System Info
System:
OS: Linux 5.15 Ubuntu 20.04.5 LTS (Focal Fossa)
CPU: (12) x64 Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz
Memory: 25.24 GB / 31.32 GB
Container: Yes
Shell: 5.0.17 - /bin/bash
Binaries:
Node: 16.14.2 - ~/.nvm/versions/node/v16.14.2/bin/node
Yarn: 1.22.5 - ~/.yarn/bin/yarn
npm: 8.5.5 - ~/.nvm/versions/node/v16.14.2/bin/npm
Browsers:
Chrome: 105.0.5195.125
Firefox: 107.0
npmPackages:
vue: ^3.2.45 => 3.2.45
Any additional comments?
It's not a bug. It's more like a question - why this specific case is not auto converted. We know (from vue2) that listeners are not auto convered, that's why it was a surprise to discover that @some-event
, @someEvent
and even @SomeEvent
- everything is working. It's natural to expect that an event, defined in a form of a prop, :on-some-event
will inherit prop name conversion and it will be possible to trigger it, but it's not.