Sales

Wat is Axios en Hoe wordt het gebruikt in Vue.Js

Emir Eskici

Emir Eskici

PlusClouds Auteur

Vue.Js ile Axios Kullanımı

Wat is Axios?
In de eenvoudigste vorm is het een JavaScript-bibliotheek die ons in staat stelt om HTTP-bewerkingen op een gemakkelijke manier uit te voeren in client-side applicaties.
Axios Installatie
We kunnen het installeren met npm, yarn en CDN.
Installatie met Npm

$ npm install axios

Installatie met Yarn

$ yarn add axios

Installatie met CDN

Kleine Voorbeeld met de Axios.get() Methode
Laten we een klein API-voorbeeld maken met de get() methode van Axios


import axios from 'axios' // importeren we axios om het te gebruiken nadat we het hebben geïnstalleerd
export default {
data(){
    return{
        users:null, // ik heb een lege variabele genaamd users gemaakt 
    }},
  methods:{
    function (){
    axios.get('https://jsonplaceholder.typicode.com/users').then((response) => { 
    // we hebben de api aangeroepen en daarna gebruikten we de then() methode voor de te ondernemen acties
     this.users = response.data; // we hebben de data-object in de response die we hebben ontvangen bereikt en deze toegewezen aan de variabele users
     console.log(this.users); // nu hebben we het resultaat in de console afgedrukt om het te zien
     })
  }
}
}

Console-uitvoer
drawing

Laten we het resultaat van het voorbeeld visualiseren
Laten we een kleine tabel maken met behulp van Bootstrap en de gegevens van de API in deze tabel plaatsen

En het resultaat…

result