HTTP Request pada Vue js dengan Axios

Ada beberapa metode yang dapat digunakan untuk mengakses data dari suatu API. Saat kita membangun aplikasi web menggunakan framework Vue.js, kita dapat melakukan http request dengan memanfaatkan library vue-resource. Tetapi sejak Evan You mengumumkan untuk memensiunkan library official Vue.js ini, penggunaan vue-resource untuk menangani Ajax request atau http request tidak lagi disarankan. Alternatif metode yang disarankan oleh Evan You dan timnya adalah Axios.

Axios

Akhir-akhir ini penggunaan Axios sangat familiar di kalangan Developers khususnya para pengguna Javascript. Axios dikenal dengan istilah Promise based HTTP client. Dimana axios lebih prioritas mengembalikan promise daripada memanggil callbacks. Hal yang paling umum yang dapat kita lakukan dengan Axios adalah HTTP request dari browser atau membuat HTTP request dengan Node.js.

Install Axios

Menggunakan NPM :

$ npm install axios

Menggunakan cdn :

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

Mengakses API dengan Axios

Berikut merupakan salah satu contoh yang dapat kita lakukan dengan Axios. Disini kita akan mengambil data dari REST API menggunakanGet request Axios.

Dalam script ini get methods dilakukan dengan mengambil seluruh data dari API dan data dengan parameter id tertentu dalam API.