通过向axios传递相关配置项 ( confg对象 ),创建axios请求:
axios({
method: "post",
url: “/user”,
data: { firstName: "Fred", lastName: "Flintstone" },
params: { id: 1234}
})
axios请求方法别名
axios.request(config)
axios.get(url[, config])
axios.delete(url[, config])
axios.head(url[, config])
axios.options(url[, config])
axios.post(url[, data[, config]])
axios.put(url[, data[, config]])
axios.patch(url[, data[, config]])
这一段,信息量很大:
比如: axios.post(url[, data[, config]])
axios.post()的第一个参数是url,第2个参数是data参数(即post的body),第三个参数是config对象。
通过观察,使用别名时,method,url 和 data都不必在最后一个参数config对象中指定。
axios.all() 参数是可迭代对象,array,set 或者 map等
axios.spread() 参数是一个回调函数
axios.create( ) 参数是一个config对象
全局的axios默认配置:
axios.defaults.baseURL = "http://www.123.com/"
axios.defaults.headers.post['Content-Type'] = 'application/x-www-urlencoded'
当实例创建后,也可修改实例的默认配置
axiosInstance.defaults.headers.common['Autorization'] = AUTH_TOKEN
配置的优先级:
传入的config中的配置 > instance.defaults设置的配置 > axios.create() 中传入的配置
axios错误处理:
config配置项中加入了validateStatus后,会出现下面改变
validateStatus: (status) => {
// return status <= 200 // e.response 会被打印出来
return status <= 500 //e.response 不会被打印出来
}
即:
validateStatus 函数返回true时,response会出现在 instance.interceptors.response.use(successCallBack, errorCallBack) 的successCallBack;为 false时,会出现在 errorCallBack中。
所以,拦截非200的请求可以这么做:
validateStatus: (status) => {
return status === 200
}
将axios请求中的token用批量替换的方式进行替换
instance.interceptors.request.use((config) => {
let url = config.url
if(url.includes("{token}")) {
config.url = url.replace("{token}", token)
}
return config
}, (error) => {
console.log("error 结果", error)
})
当参数要以application / x-www-form-urlencoded
格式发送数据。可以有以下方法(测试过):
1,借用qs.stringify,请求的headers的Content-Type会自动改变为 application / x-www-form-urlencoded 数据也会变成url的格式
2,使用formData,看代码:
上面和下面的方式,axios.post传入params,都可以得到想要的结果
let params = new FormData()
params.append('name', obj.brokerCode)
params.append('longLink', obj.longLink)
const params = qs.stringify({
name: obj.brokerCode,
longLink: obj.longLink
})
以上就是axios请求,后面在使用过程中遇到问题,会继续补充。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。