I have data in App.vue that looks like this:
data() {
return {
information: {
item1: 'item 1 string',
item2: 'item 2 string',
item3: 'item 3 string'
}
}
},
I want to pass this info into a component like this:
<ComponentName prop="something-else" info=this.data.information.item1 />
But I don't get the data, I just get the string..?
Passing data to components in vue.js
SO I go:
<ComponentName prop="something-else" :info=this.data.information.item1>
But my whole page goes blank
Vue JS 3: How to pass data from one component to another other?
I'm a little bit confused by this one but then I found
Passing the data into component in vuejs
So I added basically like, a static method
<ComponentName prop="something-else" information=information.item1>
methods: {
information() {
this.information.item1 = information.item1
}
},
But I get an error about duplicated key and a no-undef error.
How do you pass data from vue into a component?
You should access directly the data returned from the data
option and bind it to the prop :
<ComponentName :info="information.item1">