How to load all server side data on initial vue.js / vue-router load?

Question

I\'m currently making use of the WordPress REST API, and vue-router to transition between pages on a small single page site. However, when I make an AJAX call to the server

Answer 1

Check this section in docs of Vue Router

https://router.vuejs.org/guide/advanced/data-fetching.html

So first of you have to write method that would fetch data from your endpoint, and then use watcher to watch route.

export default {
    watch: {
        '$route': 'fetchItems'
    },
    methods: {
        fetchItems() {
          // fetch logic
        }
    }
}

Since you are working with WP Rest API, feel free to check my repo on Github https://github.com/bedakb/vuewp/blob/master/public/app/themes/vuewp/app/views/PostView.vue#L39