我是靠谱客的博主 专一心锁,最近开发中收集的这篇文章主要介绍关于axios的简单记录,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

通过axios请求

axios(config)
或者
axios别名请求
注意:别名请求时候第一个url参数是必须的,然后除了post patch 以及put请求的第二个参数是data外,其他的别名请求第二个参数应该接config

axios.request(config) :非别名请求 参数跟axios(config) 一样

axios.get(url)
axios.post(url,data)

其中url、method、以及data都不应该再写到config当中了

通过axios的实例请求

通过axios.create()得到实例,然后通过实例方法(跟axios的别名方法一样)发送请求
当然我们也可以在创建实例时候设置一些基本配置,这个配置将覆盖通过axios.defaults.baseURL 设置的配置

const instance = axios.create({
      baseURL: 'http://127.0.0.1:3000/'
});

//使用
instance(config).then(res=>{})
//别名方式
instance.get(url)

拦截器

我们可以通过拦截器在发送请求之前和响应前做些处理

在请求拦截器当中我们可以对配置进行修改。
注意关键单词:interceptors.请求/响应.use(函数)

    instance.interceptors.request.use(function (config) {

        // 请求之前修改配置,添加上需要验证使用的token
        config.headers = {
            authorization: 'asdf eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJwYXNzSWQiOiJDWDAwMDAwMDIxIiwiaWF0IjoxNjczMzE2NjQ1LCJleHAiOjE2NzMzMjAyNDV9.mx2KXf8m-eXg_o_u9ppQ73QfPSBQsn8ZJI8bxdnac-g'
        };
        //记得返回配置
        return config;
    });
    instance.get('/admins/list', {
        params: {
            nowPage: 1,
            pageSize: 4
        }
    }).then(res => {
        console.log(res.data.list);
    })

响应拦截器当中对一些响应进行统一处理

// 添加响应拦截器
axios.interceptors.response.use(function (response) {
    // 2xx 范围内的状态码都会触发该函数。
    // 对响应数据做点什么
    return response;
  }, function (error) {
    // 超出 2xx 范围的状态码都会触发该函数。
    // 对响应错误做点什么
    return Promise.reject(error);
  });

默认配置

我们可以给他们设置一些默认配置,可以用axios.defaults 或者创建实例时候设置默认配置,另外也可以在请求拦截当中添加默认配置

其他

返回的res当中的data才是实际服务端响应的数据
对于不设置method的请求,默认为get请求

对于post请求 应该通过data设置参数,对于get请求应该使用params

最后

以上就是专一心锁为你收集整理的关于axios的简单记录的全部内容,希望文章能够帮你解决关于axios的简单记录所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(60)

评论列表共有 0 条评论

立即
投稿
返回
顶部