This is the main vue component. I want to make an ajax request and pass the data using the render method to my app component, which is a standalone component in a different file. How do I pass this data and how can I retrieve it in my app component. I am learning Vue, I know how to do this with <template></template>
but would like to know if it is possible to do it this way.
JavaScript
x
11
11
1
new Vue({
2
el: '#app',
3
data: {
4
data: {}
5
},
6
mounted() {
7
axios.get("http://stag.cyberserge.com:4000/autos").then(res => this.data = res.data)
8
},
9
render: h => h(App, this.data)
10
});
11
Advertisement
Answer
Pass it as a property.
JavaScript
1
4
1
render(h){
2
return h(App, {props: {appData: this.data}})
3
},
4
See the documentation here.
In your App component, add appData (or whatever you want to call it) as a property.
JavaScript
1
5
1
export default {
2
props: ["appData"],
3
4
}
5
Here is an example of this working.