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
Vue.js load data with JSON
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