6👍
✅
In your parent template
<div id="app">
<child :myVarName="message"></child>
</div>
replace
<child :myVarName="message"></child>
with
<child :my-var-name="message"></child>
Additionally you can refer this to get insights of casing.
3👍
Leave everything as is in your updated example EXCEPT in the HTML change “myVarName” to “my-var-name” – this is done by default by Vue and within the js you can use the camelCased version myVarName still.
Source:stackexchange.com