Peticiones HTTP en Vue
Peticiones HTTP con axios en Vue.js
Vue no incorpora un servicio cliente-HTTP como si disponen otros frameworks como Angular, por tanto es necesario instalar alguna librería en el proyecto que permita realizar peticiones HTTP. Axios es un cliente HTTP muy popular y comúnmente utilizado por otros frameworks que ofrece un servicio HTTP manejando promesas de JavaScript.
Instalar Axios
npm install --save axios
Para trabajar con Axios tan solo es necesario importar la librería desde el componente donde se desea trabajar y mediante los distintos verbos realizar las peticiones a la API.
import axios from 'axios';
A continuación se muestra un ejemplo de un método que utiliza la librería axios para procesar una petición de tipo GET con una promesa que obtiene la respuesta y la muestra por consola.
...
methods:{
getUsers(){
axios.get("http://bahiaxip.com/api/users").then( response => {
console.log(res);
}
}
}
...
Petición tipo POST
...
data(){
user: new User("xip","bahiaxip@hotmail.com","2020","1234")
}
methods:{
save(){
axios.post("http://bahiaxip.com/api/save",this.user).then(response=> {
if(res.data.status === 'success)
{alert("El usuario se ha creado correctamente);
}else{
alert("Hubo un error y el usuario no ha sido creado");
}
}
}
}
...
Para poder comentar es necesario iniciar sesión