axios的各种传参方式

1、 params方式

axios({

url: '/users',

method: 'get',

params: {

id: '11111',

name: '22222'

}

})

请求地址:/users?id=11111&name=22222

请求体:无

注:get请求是没有请求体的,所以get请求只能使用params传参。

2、 data方式

(1)application/x-www-form-urlencoded(表单方式)

axios({

url: '/users',

method: 'post',

data: qs.stringify({

id: '11111',

name: '22222'

})

})

请求地址:/users

请求体:id=11111&name=22222

(2)application/json(JSON方式

axios({

url: '/users',

method: 'post',

data: {

id: '11111',

name: '22222'

}

})

请求地址:/users

请求体:{"id":"11111","name":"22222"}

(3)multipart/form-data(文件方式

const formData = new FormData()

formData.append('id', '11111')

formData.append('name', '22222')

formData.append('file', 此处是<input type='file'>的value)

axios({

url: '/users/upload',

method: 'post',

headers: { 'Content-Type': 'multipart/form-data' },

data: formData

})

请求地址:/users

请求体:

-----------------------------2024497587069

Content-Disposition: form-data; name="id"

11111

-----------------------------2024497587069

Content-Disposition: form-data; name="name"

22222

-----------------------------2024497587069

Content-Disposition: form-data; name="file"; filename="2019年前端资源估算.xls"

Content-Type: application/vnd.ms-excel

ÐÏࡱá

axios的各种传参方式的更多相关文章

  1. PHP四种传参方式

    test1界面: <html> <head> <title>testPHP</title> <meta http-equiv = "co ...

  2. python 计算机发展史,线程Process使用 for循环创建 2种传参方式 jion方法 __main__的解释

    ########################总结################## #一 操作系统的作用: 1:隐藏丑陋复杂的硬件接口,提供良好的抽象接口 2:管理.调度进程,并且将多个进程对硬 ...

  3. Vue中router两种传参方式

    Vue中router两种传参方式 1.Vue中router使用query传参 相关Html: <!DOCTYPE html> <html lang="en"> ...

  4. vue param和query两种传参方式

    1.传参方式 query传参方式 this.$router.push({ path: "/home", query: {code:"123"} }) param ...

  5. 浅谈C++三种传参方式

    浅谈C++三种传参方式 C++给函数传参中,主要有三种方式:分别是值传递.指针传递和引用传递. 下面通过讲解和实例来说明三种方式的区别. 值传递 我们都知道,在函数定义括号中的参数是形参,是给函数内专 ...

  6. Mybatis的几种传参方式,你了解吗?

    持续原创输出,点击上方蓝字关注我 目录 前言 单个参数 多个参数 使用索引[不推荐] 使用@Param 使用Map POJO[推荐] List传参 数组传参 总结 前言 前几天恰好面试一个应届生,问了 ...

  7. mock和axios常见的传参方式

    第一次接手项目,传参方式还有些吃力,因此做一下总结. 首先我们需要会看swagger中的接口.里面写了某个接口需要接收什么样的值,前端怎么传递这个值 在mock中的传参方式: mock中传参的方式有两 ...

  8. vector作为参数的三种传参方式

    c++中常用的vector容器作为参数时,有三种传参方式,分别如下(为说明问题,用二维vector): function1(std::vector<std::vector<int> ...

  9. vue的三种传参方式

    <template> <div> <router-link :to="{'name':'x',params:{'type':'users'}}"> ...

随机推荐

  1. 2019 物易云通java面试笔试题 (含面试题解析)

      本人5年开发经验.18年年底开始跑路找工作,在互联网寒冬下成功拿到阿里巴巴.今日头条.物易云通等公司offer,岗位是Java后端开发,因为发展原因最终选择去了物易云通,入职一年时间了,也成为了面 ...

  2. webpack4 css modules

    demo 代码点此,webpack4 中通过 css-loader 开启 css 模块化, 开始前先做点准备工作. 不了解 css 模块化的,可以前往查看github_css_modules. ##准 ...

  3. 微信小程序自定义tabbar的实现

    微信小程序自定义tabbar的实现 目的:当采用微信的自定义tabbar组件的时候,切换的时候会出现闪屏的效果:当使用微信默认的tabbar的时候,限制了tabbar的数量以及灵活配置. 方案:自己动 ...

  4. Android Studio 3.5+ 使用androidx的recyclerView

    一 File->project structure->Dependencies: 点击All Dependencies处的加号,选择Library Dependency: 在step1处输 ...

  5. GIC , SPI , PPI (窝窝科技的文章题目改了下)【转】

    转自:https://www.cnblogs.com/tureno/articles/6403408.html 转载于:  http://www.wowotech.net/irq_subsystem/ ...

  6. BitTorrent协议与MagNet协议原理【转】

    转自:https://blog.csdn.net/u012785382/article/details/70674875 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog ...

  7. Rust中的函数调用

    注意区别语句和表达式哟. Rust是一门基于表示式的语言,牢记!!! fn main() { println!("Hello world!"); another_function( ...

  8. 剖析linux内核中的宏---------container_of

    #define container_of(ptr, type, member) ({ \ const typeof(((type *)0)->member) * __mptr = (ptr); ...

  9. 2019.6.11_MySQL进阶三:临时表

    临时表 临时表主要应用于保存一些临时数据.临时表只在当前连接可见.当关闭连接时,MySQL会自动删除表并且释放空间.临时表在MySQL 3.23版本中添加,低于 3.23版本就无法使用MySQL的临时 ...

  10. 使用CSS来渲染HTML的表单元素

    效果: 实现: <!DOCTYPE html> <html> <head> <title>使用CSS来渲染HTML的表单元素</title> ...