oten
291
2
Vue

Laravel collection values to Vue array

Posted 1 year ago by oten

I'm experimenting with Vue.js and I came across a problem that I can't solve. I have a collection returned from Laravel that I pass as a prop in my Vue Component:

<custom-component :posts="{{ json_encode($posts) "}}></custom-component>

In my CustomComponent.vue I want to populate an array for each record of the collection like so:

var array = [
  {
    'post_name' => this.posts.name,
    'other' => 'random stuff'
  }
]

so in the end the array will be something like:

[
  {
    'post_name' => 'Post 1',
    'other' => 'random stuff'
  },
  {
    'post_name' => 'Post 2',
    'other' => 'random stuff'
  }
  [...]
]

What is the correct way to loop through the "posts" object and populate the array?

Please sign in or create an account to participate in this conversation.