[Vuejs]-Why can't child components get the data from parent component?

by

0👍

When defining the attributes on an HTML element keep in mind that HTML is case insensitive. So a prop defined as allBaseRules really is seen as allbaserules. So you need to use "Kabab-case" when defining the attribute name as below.

<edit-dialog 
  ref="editDialog" 
  :row="scope.row" 
  :index="scope.$index" 
  :all-base-rules="allBaseRules" 
  :all-actions="allActions"
 >

Vue automatically recognizes the kabab-case props and converts them to camelCase for you. So you are fine to still receive the props as you are currently.

https://v2.vuejs.org/v2/guide/components-props.html#Prop-Casing-camelCase-vs-kebab-case

See the the example here https://jsfiddle.net/skribe/1dbfj8h6/

Leave a comment