vuejs

10. Integrating vue-resource
10.1 Overview
Vue-recourse is a resource plugin for Vue.js. This plugin provides services for making web requests
and handles responses using an XMLHttpRequest or JSONP.
We are going to make again all the web requests we made above, using this plugin instead. This way
you can see the differences and decide for yourself which suits you best. jQuery is nice, but if you
are using it only to perform AJAX calls, you may consider removing it.
Here you can find installation instructions and documentation about vue-recourse¹ As usual, we are
going to to “pull it in” from the cdnjs² page.
To fetch data from a server and bring them up to display in the browser, we can use vue-resource
$http method with the following syntax:
1 ready: function() {
2 // GET request
3 this.$http({url: '/someUrl', method: 'GET'})
4 .then(function (response) {
5 // success callback
6 }, function (response) {
7 // error callback
8 });
9 }
Info
A Vue instance provides the this.$http(options) function which takes an options object
for generating an HTTP request and returns a promise. Also the Vue instance will be
automatically bound to this in all function callbacks.
Instead of passing the method option, there are shortcut methods available for all request types.
¹https://github.com/vuejs/vue-resource
²https://cdnjs.com/libraries/vue-resource
109