Passing Object as props does not work

I have a JSON-Object and I want to pass it to a child component, however this does not work, the prop is undefined
I can iterate through the Object in the parent component, but if I try to pass the whole object “cherry” to the child component nothing happens:

What can be the problem? Thanks a lot!
Here is the code:

  <div v-for="section in cherry[0].sections" :key="">
    <div class="accordion d-flex" :id="">
      <span>{{ section.label }}</span>

     <cherry-pick :cherryObject="cherry" :section=""></cherry-pick>     

 app.component('cherry-pick', {

         props: ['section','cherryObject'],

         created() {



this.cherryObject (cherry-pick) is undefined

Finally I want to pass cherry[1].cpicks, but cherry alone should also work, and the JSON objects exists and is valid since the first v-for loop works perfectly fine!


Amaybe a matter of casing?

1 Like

Share your full code

Ok, I have the object in props now:




@iago to pass an object you need to use v-bind so your codes may like this

<cherry-pick v-bind:cherryObject="cherry" v-bind:section="section"></cherry-pick>

“:” is just the shorthand of “v-bind”. Also Iago’s original issue was that he couldn’t pass an object as a prop then his last comment is “Ok, I have the object in props now:” So that would mean this is resolved no?