vuejs

Integrating vue-resource 110
Request shortcuts
1 this.$http.get(url, [data], [options]).then(successCallback, errorCallback);
2 this.$http.post(url, [data], [options]).then(successCallback, errorCallback);
3 this.$http.put(url, [data], [options]).then(successCallback, errorCallback);
4 this.$http.patch(url, [data], [options]).then(successCallback, errorCallback);
5 this.$http.delete(url, [data], [options]).then(successCallback, errorCallback);
10.2 Migrating
It is time to use vue-resource in our example. First of all, we have to include it. We will add this
line to our HTML file.
1
To fetch the stories we will make a GET request in the corresponding form.
1 ready: function() {
2 // GET request
3 this.$http({url: '/api/stories', method: 'GET'}).then(function (response) {
4 this.$set('stories', response.data)
5 //Or we as we did before
6 //vm.stories = response.data
7 })
8 }
Our list of stories comes without any problems using the syntax above.
Lets move on now with the DELETE and PATCH requests using the shortcut methods.
PATCH request
1 upvoteStory: function(story){
2 story.upvotes++;
3 this.$http.patch('/api/stories/'+story.id , story)
4 },
We have replaced the AJAX method with this one, in no time!