vue中fetch 和axios理解

一、fetch 请求参数
fetch(‘/books‘,{
method:‘post‘,
body:‘uname =list&pwd = 123‘,
headrs:{
‘Content-Type‘:"application/x-wwww-form-urlencode"
}
}).then(res=>{
return res.next()
}).then(res=>{
console.log( res)
})
fetch响应的结果
响应数据结构
1、 text()将返回处理成字符串
2、 json（）将返回处理成json
二、axios接口调用方法
1、支持浏览器
2、支持promise
3、能拦截请求和响应
4、自动转化JSON
三、axios的api使用方法
1、get 获取
2、post 添加
3、put 修改
4、delete 删除数据
GET传递参数
1、 通过url传 axios.get( ‘/data?id=123‘).then()
2、 通过params选项传递参数 axios.get(‘/adata‘,{ params:{ id:123 } } )
四、POST传递
const param = new URLSerachParmams();
param.append(‘param1‘,value1)
param.append(‘param2‘,value2)
axios.post(‘htttp‘,param).then(res=>{})
五、axios响应的结果
(一)、 1、data
2、headers
3、status
axios.post(‘/axios-json‘)
（二）、全局配置
1、axios.default.titmes = 3000 设置超时时间
2、axios.default.baseURL = "http://localhost:4200″设置默认地址
3、axios.default.header[‘myToken‘] =""设置请求头
（三）、axios拦截器
1、在发出请求之前设置一些信息
axios.intercepetor.request.use((config) =>{
在请求之前设置一些信息
比如设置请求头
return config
},
( err)=>{
console.log(err)
}
)
2、响应拦截器
在获取数据之前，做一些处理
axios.interceptor.response.use( (res)=>{
var data = res.data
return data
} )

vue中fetch 和axios理解

原文地址：https://blog.51cto.com/14582569/2518285