search

vuejs / vue

This is the repo for Vue 2. For Vue 3, go to https://github.com/vuejs/core
http://v2.vuejs.org
MIT License
207.46k stars 33.65k forks source link

Dynamic arguments upper case problem #9528

Closed karaozgur closed 5 years ago

karaozgur commented 5 years ago

Version

2.6.6

Reproduction link

https://jsfiddle.net/6s4cg2pv/3/

Steps to reproduce

when you open the fiddle you will see dynamic attributes refers camel case varibales(slotName , attributeName) but vue is looking for lower case variables. if you cahange varibale names in data to slotname and attributename it works fine.

What is expected?

dynamic attribute variables must look for exact variable name

What is actually happening?

dynamic attributes refers camel case varibales but vue is looking for lower case variables.

posva commented 5 years ago

This is an HTML limitation. You will have to use the object syntax with v-bind

<a v-bind="{ [keyName]: value }"/>

what you wrote will work on vue files and string templates though :)

SuperlativeEntity commented 3 years ago

latest vuejs3 documentation doesn't mention this. Old doc says this "When using a template in the DOM (write the template directly in an HTML file), you also need to avoid using uppercase characters to name the key name because the browser will force all attribute names to lowercase"