Axios 整理常用形式及涉及的参数

一、axios get请求

javascript 复制代码
//形如
axios.get(url[, config])
  .then(response => {
    // 处理响应
  })
  .catch(error => {
    // 处理错误
  });
//无 config 的情况下,
axios.get('https://api.example.com/data')
  .then(response => {
   // 处理响应
  }) .catch(error => {
   // 处理错误
  });
  1. url:即请求api 链接;
  2. , config:表示config 可有可无

axios get请求 一 config 参数(常用)

javascript 复制代码
// An highlighted block
axios.get('https://api.example.com/data',{
	//传递的数据:方式二选一;
	//我们通过 `params` 对象传递了查询参数,
	//实际上请求的URL会变成 'https://api.example.com/data?username=test'。
	params:{
		"username":"test",
	},
	headers:{
		"Content-Type":"application/json",
	},
	timeout:1000,//请求超时设置
})
  .then(response => {
   // 处理响应
  }) .catch(error => {
   // 处理错误
  });

二、axios post

javascript 复制代码
//形如
axios.post(url,data[, config])
  .then(response => {
    // 处理响应
  })
  .catch(error => {
    // 处理错误
  });
//无 config 的情况下,
axios.post('https://api.example.com/data',{
	firstName: 'Fred',
    lastName: 'Flintstone'
})
  .then(response => {
   // 处理响应
  }) .catch(error => {
   // 处理错误
  });
  1. url:即请求api 链接;
  2. data:传递的参数,object { } 形式;
  3. , config:表示config 可有可无

axios post请求 一 config 参数(常用)

javascript 复制代码
axios.post('https://api.example.com/data',data,{
	//传递的数据:方式二选一;
	data: {
   		 firstName: 'Fred'
 	},
	headers:{
		"Content-Type":"application/json",
	},
	timeout:1000,//请求超时设置
})
  .then(response => {
   // 处理响应
  }) .catch(error => {
   // 处理错误
  });

三、axios() 发起请求

javascript 复制代码
//形如
axios({
	//config内容 常用字段
	method:'get/post',//常用的
	url:'/data',
	baseURL: 'https://api.example.com',
	//params 用于 get 传参数
	params:{},
	//data 用于 post 传递参数
	data:{},
	headers:{},
	timeout:100,
	
})
  .then(response => {
   // 处理响应
  }) .catch(error => {
   // 处理错误
  });

四、axios 创建实例

相关推荐
幸运小猿3 小时前
模拟慢上传-处理超时重试image 丢失线上问题
前端·javascript·html
速易达网络6 小时前
ECharts 图表制作完全指南:从零到可视化实战
前端·javascript·echarts
paopaokaka_luck7 小时前
灾害应急物资管理系统(AI应急助手、Echarts可视化数据看板、捐赠入库联动、 物资全流程管理、库存变动追溯、灾情资讯与互动反馈、物资发放公示)
java·前端·javascript·spring boot·mysql·tomcat·echarts
kyriewen7 小时前
我验了 7 种 sticky 失效说法:3 种根本不成立
前端·javascript·程序员
我命由我123458 小时前
Python 实用操作 - 文件操作(打开与关闭文件、读取文件、文件写入)
java·开发语言·前端·javascript·数据库·python·java-ee
Momo__9 小时前
你写的 import 重试,从来没生效过
前端·javascript·typescript
tryCbest10 小时前
Vue3——第 11 篇:组合式 API(上)——setup 与响应式 API 深度解析
前端·javascript·vue.js
tryCbest11 小时前
Vue3——第 13 篇:计算属性与侦听器——computed 与 watch 的进化
前端·javascript·vue.js
用户1179536547811 小时前
企业团队编程软件怎么选:AI编程工具的协作与落地能力对比
javascript
believed_breadfruit11 小时前
我开源了一个HTML 分页导出工具,解决了复杂页面的内容截断、跨页错乱和长文档白屏问题
前端·javascript·github