O'Reilly logo

Full-Stack Vue.js 2 and Laravel 5 by Anthony Gore

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Axios

To perform AJAX requests to the web service, we'll use the Axios HTTP client, which is included with Laravel's default frontend code. Axios has a very simple API allowing us to make requests to a GET URL like this:

axios.get('/my-url');

Axios is a Promise-based library, so in order to retrieve the response, you can simply chain a then callback:

axios.get('/my-url').then(response => {
  console.log(response.data); // Hello from my-url
});

As the Axios NPM package is already installed, we can go ahead and import the HomePage component. We can then use it to perform the request to the home API endpoint, /api/. In the then callback, we apply the returned data to the component instance exactly as we did with the inlined model.

resources/assets/components/HomePage.vue ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required