axios请求拦截器

简介: axios请求拦截器

配置


1. 安装axiosnpm install axios

2. 引用axios:在需要使用的页面中引用


get方式使用


get请求使用params传参,本文只列举常用参数,更多详见: 使用说明 · Axios 中文说明 · 看云 (kancloud.cn)

axios({
      url: "", // url
      params: {
        // 参数
        name: xxx,
        age: xxx,
      },
    })
      .then(function (res) {
        console.log(res); // 成功回调
      })
      .catch(function (err) {
        console.log(err); // 失败回调
      });


post请求


post请求使用data传参,需要使用qs处理参数


qs配置


axios的post请求为什么要使用qs_苦夏木禾的博客-CSDN博客

qs是axios的一个数据序列化工具,可通过npm install qs命令进行安装.然后在需要使用的页面引用

import axios from 'axios'
import qs from 'qs'


方法 qs.parse()qs.stringify()

qs.stringify()将对象序列化成URL的形式,以&进行拼接

qs.parse()将URL解析成对象的形式


写法

 axios({
      method: "post", //请求方式
      url: "", //url
      data: qs.stringify({
        // 参数
      }),
    })
      .then(function (res) {
        console.log(res); //成功回调
      })
      .catch(function (err) {
        console.log(err); //失败回调
      });
相关文章
|
6天前
|
JSON 前端开发 JavaScript
axios请求成功而$.ajax却不行排错
axios请求成功而$.ajax却不行排错
14 2
|
6天前
axios拦截器
axios拦截器
12 0
|
6天前
|
JavaScript
axios拦截器:每次请求自动带上 token
axios拦截器:每次请求自动带上 token
10 0
|
6天前
|
前端开发
axios拦截器的使用?
axios拦截器的使用?
10 0
|
6天前
|
前端开发 JavaScript 数据格式
vue3中axios添加请求和响应的拦截器
vue3中axios添加请求和响应的拦截器
15 1
|
6天前
|
存储 算法 JavaScript
< 今日小技巧:Axios封装,接口请求增加防抖功能 >
今天这篇文章,主要是讲述对axios封装的请求,由于部分请求可能存在延时的情况。使得接口可能存在会被持续点击(即:接口未响应的时间内,被持续请求),导致重复请求的问题,容易降低前后端服务的性能!故提出给axios封装的配置里面,新增一个防抖函数,用来限制全局请求的防抖。
< 今日小技巧:Axios封装,接口请求增加防抖功能 >
|
6天前
axios中的get带参数的请求方法
axios中的get带参数的请求方法
|
6天前
|
JavaScript 数据格式
Vue axios请求拦截和相应拦截
Vue axios请求拦截和相应拦截
22 2
|
6天前
|
JavaScript API
Vue中axios拦截器怎么使用
Vue中axios拦截器怎么使用
|
6天前
|
JavaScript
vue封装axios(用interceptors封装)
vue封装axios(用interceptors封装)
14 0