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

  1. 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.

  1. 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.

  1. ...
  2. methods:{
  3. getUsers(){
  4. axios.get("http://bahiaxip.com/api/users").then( response => {
  5. console.log(res);
  6. }
  7. }
  8. }
  9. ...

Petición tipo POST

  1. ...
  2. data(){
  3. user: new User("xip","bahiaxip@hotmail.com","2020","1234")
  4. }
  5. methods:{
  6. save(){
  7. axios.post("http://bahiaxip.com/api/save",this.user).then(response=> {
  8. if(res.data.status === 'success){
  9. alert("El usuario se ha creado correctamente);
  10. }else{
  11. alert("Hubo un error y el usuario no ha sido creado");
  12. }
  13. }
  14. }
  15. }
  16. ...


Comentarios: 0

Para poder comentar es necesario iniciar sesión



Este dominio utiliza cookies de terceros para crear estadísticas y publicidad personalizada. Si continúa navegando está aceptando su uso