[Vuejs]-Use data from parent in child

by

1👍

✅

To pass data from parent to child you use props.

In the parent template you use v-bind the prop name and then the value or values from the parent you want to pass. v-bind:test-data="test" The value can be any type from a string to an array or an object.

...
<v-content>
  <v-container fluid fill-height>
     <router-view v-bind:test-data="test"></router-view>
  </v-container>
</v-content>
...

In your child receive the props. Note the change from kabab-case to camelCase

export default {
   name: 'Home',
   props: ['testData'],
   
   // do something with the testData

      created () {
        console.log(this.testData)
      }

   }
👤skribe

Leave a comment