Load json data to component in Vue

In this tutorial, we will see how we can load JSON data to a component in Vue.js. I am going to use following REST API end point to load data. In this example I am going to use the $.getJSON function which comes with the jQuery library.

To get the Json data to the vue component I am using following API end point
http://ilikecoding.net/membership/api/memberships

Now we will see how to code it

This is the html template which we are going to use

In above code, we have used two javascript libary. One is for the Vue and other one is for the jQury

Now we will add the Vue code
Under scripts section, you can add the following code

Under mounted() you can see the getJSON() to load the data from the REST end point
The data will be loaded to the products variable