Home > Article > Web Front-end > Introduction to how to simply configure axios with vue.js
This article mainly introduces the method of simply configuring axios in vue.js. It has a certain reference value. Now I share it with you. Friends in need can refer to it.
axios is a Promise-based application. For browsers and nodejs HTTP clients, the following article mainly introduces you to the relevant information about the simple configuration of axios with vue.js. Friends who need it can refer to it. Friends who need it can come and learn together.
Preface
Officially no longer recommends using resource. We can’t lag behind if we switch to axios. At least you have to know. Come on, you can brag to the interviewer during the interview and don't talk too much nonsense.
It itself has the following characteristics:
Create XMLHttpRequest from the browser
Issue an http request from node.js
Support Promise API
Interception of requests and responses
Convert request and response data
Cancel request
Automatically convert JSON data
Client Support preventing CSRF/XSRF
Configuration method
First install with npm
npm install --save axios vue-axios
After installation, configure it in your main.js file and add these two sentences
import axios from 'axios' Vue.prototype.$http = axios
Then when you read the interface data, you can write it directly like this. This is the same as resource. The op, uin and so on below are the parameters to be passed.
this.$http.post(localStorage.getItem("addUrl")+'/skynet_sync/btsp', { "op": "update_card_num", "uin": uin, "protypeId": index, "cardNumber": parseInt(v) }) .then(response=> { //如果接口走成功就执行这里 }).catch(function (error) { //接口失败,也就是state不是200的时候,走这里 });
Okay, done!
The above is the entire content of this article. I hope it will be helpful to everyone's study. For more related content, please pay attention to the PHP Chinese website!
Related recommendations:
How to use Vue.js instructions to implement the select-all function
About the usage analysis of vue routing
The above is the detailed content of Introduction to how to simply configure axios with vue.js. For more information, please follow other related articles on the PHP Chinese website!