[Vuejs]-How do I inject data from the server into a Vue CLI app?

1๐Ÿ‘

I was able to figure it out.

By defining the SiteContainer component as a Vue.js component in main.js first, I am able to freely use the component in the HTML file to get what I want.

Specifically, I changed the main.js file as follows:

import Vue from 'vue';
import SiteContainer from './components/SiteContainer.vue';

Vue.component('SiteContainer', SiteContainer); // This is the key.

new Vue({
    el: '#app'
});

And then the body part of the HTML file becomes the following (i.e., replace the #app div that I had in my question above):

<SiteContainer id="app" :data="{{ json-string-of-data-payload-from-server }}">
</SiteContainer>
๐Ÿ‘คHartleySan

Leave a comment