这一节介绍如何创建 Axios 实例,以及各种 config 之间的优先级。
5-1.创建instance
在实际项目中,如果我们始终使用 axios(config) 、 axios.get(url[, config]) 或 axios.post(url[, data[, config]]) 来发送请求,那么每次请求都需要单独配置 config,这看起来有点过于繁琐。
较为理想的请求方式是这样的,只关注以下三个方面:
methodurlparams或data(分别对应getpost方式)
那么此时,我们可以通过 axios.create([config]) 来创建一个实例。
此处的 config,我们可以称作 instance config。
js
const instance = axios.create({
baseURL: 'https://some-domain.com/api/',
timeout: 1000,
headers: {'X-Custom-Header': 'foobar'}
})创建 instance 之后,它会继承 axios 的所有属性和方法。
使用 instance 创建的请求,都会有一份基础 instance config。
那么我们在项目中,可以这样使用:
js
export const getSomeThing = function (params, config) {
return instance.get('https://some-domain.com/api/', {
params,
...config
})
}
export const postSomeThing = function (data, config) {
return instance.post('https://some-domain.com/api/', data, config)
}为了不拘泥于 instance config,我们在封装方法的时候,可以把 config 暴露出来,以供二次覆盖。
这里的 config,可以称作 request config,也就是实际请求配置。
5-2.config优先级
截止到本节,我们统共接触到了三种形式的 config。
它们分别是(优先级从低到高):
defaults config默认配置instance config实例配置request config实际请求配置
当 axios 请求触发时,这三者配置会有一个 merge 合并覆盖的过程。
高优先级配置会覆盖低优先级配置。