Subscribe on changes!

using `.xx-xx` underlined naming conventions when used by WebComponent will result is not reactive

avatar
Apr 8th 2022

Version

3.2.31

Reproduction link

sfc.vuejs.org/

Steps to reproduce

Enter the RFC, click the Random button, and components named with underlined lines will not be re-rendered, but camel names will work

What is expected?

The dash style also works

What is actually happening?

not works

avatar
Apr 8th 2022

I wish I could fix this, but I found several places to fix this, such as patchProp,patchDOMProp, or VueElement's _resolveDef method, and I need a good suggestion

avatar
Apr 8th 2022

@LinusBorg Actually, WHAT I mean is that I want to develop and fix this problem by myself. I think it is most appropriate to modify it in the method resolveDef. I wonder if you can assign this task to me?

avatar
Apr 8th 2022

Hi @hcg1023

sure, you can work on this. I just assigned myself to remember to leave the suggestions you asked for.

I'm still thinking about this a bit in the context of not just custom elements but the assignment of element properties as a whole. Will get back to you shortly.

avatar
Apr 8th 2022

@LinusBorg Ok, looking forward to your reply, I will do this based on your reply

avatar
Apr 8th 2022

image I saw this in the documentation and felt like it didn't work when it was precompiled

avatar
Apr 8th 2022

image I saw this in the documentation and felt like it didn't work when it was precompiled

avatar
Nov 11th 2022

This is expected behavior. When you use .xx shorthand or the .prop modifier, the key will be used as-is without any modification. You are expressing the intention to set the prop as a DOM property with the exact key.

If you are using it in DOM templates, .camel modifier will be needed.