基于Promise 用于浏览器和 node.js的与服务器通讯的库
支持Promise API
安装
使用 npm:
$ npm install axios
npm install vue-axios --save
Vue.use(VueAxios,Axios)
import axios from './axios'
使用 bower:
$ bower install axios
使用 cdn:
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
GET:
<script type="text/javascript">
import axios from 'axios'
export default {
created(){
axios({
method: 'get',
url: 'https://easy-mock.com/mock/5b5d95b8031c6933a3664fcf/example/query'
})
.then((data)=>{
console.log(data);
})
.catch((err)=>{
console.log(err);
})
}
}
</script>
请求方式:
支持的请求方式:
axios:get(url,{
params:{ //向后端发送数据
abc: '123'
}
}).then((data)=>{}).catch((err)=>{}) axios.get(url,data)
axios:post(url,{
abc: '123' //向后端发送数据
}).then((data)=>{}).catch((err)=>{}) axios.get(url,data)
axios:delete(url,)
axios:head(url,)
axios:options(url,)
axios:put(url,data,)
axios:patch(url,data,)
简化请求地址:
<script type="text/javascript">
import axios from 'axios'
var http =axios.create({
baseURL:' https://easy-mock.com/mock/5b5d95b8031c6933a3664fcf/example/'
/*基本路径*/
timeout: 1000//多少毫秒中断发生(请求超时)
responseType: 'json' 可以设置返回数据为json格式
headers:{ //可以自定义请求头
'custome-header' : 'hello'
}
params: { //设置查询字符串
book: '123'
}
})
既:把公共的路径部分提取出来,请求的时候只写 不同的路径部分
export default {
created(){
http.get('/query')
}
}
并发请求:
function http1(){
http.get('url1')
}
function http2(){
http.get('url2')
}
axios.all(http1(),http2()).then(axios.spread((res1,res2)=>{
res1:第一个函数的返回结果
res2:第二个函数的返回结果
})) 并发