当前位置:   article > 正文

Axios传参的三种方式_axios传参的几种格式

axios传参的几种格式

一:get请求

axios中常见的get/delete请求,也称作query请求:

  1. //一般发送请求是这么写(不推荐):
  2. axios.get('/user?id=12345&name=user')
  3. .then(function (res) {
  4.     console.log(res);
  5. }).catch(function (err) {
  6.     console.log(err);
  7. });
  8.  
  9. //但是为了方便全局统一调用封装的axios,我一般采用(推荐)
  10. axios.get('/user', {  //params参数必写 , 如果没有参数传{}也可以
  11.     params: {  
  12.        id: 12345
  13.        name: user
  14.     }
  15. })
  16. .then(function (res) {
  17.     console.log(res);
  18. })
  19. .catch(function (err) {
  20.     console.log(err);
  21. });


 
二:post/put/patch请求

传参方式大致用的有3种
(1) ‘Content-Type’= ‘multipart/form-data’
传参格式为 formData
(全局请求头:‘Content-Type’= ‘application/x-www-form-urlencoded’)
(request的Header:‘Content-Type’= ‘multipart/form-data’)

  1. var formData=new FormData();
  2. formData.append('user',123456);
  3. formData.append('pass',12345678);
  4.  
  5. axios.post("/notice",formData)
  6.      .then((res) => {return res})
  7.      .catch((err) => {return err})


 
(2) ‘Content-Type’= ‘application/x-www-form-urlencoded’
传参格式为 query 形式,使用$qs.stringify
(全局请求头:‘Content-Type’= ‘application/x-www-form-urlencoded’)
(request的Header:‘Content-Type’= ‘application/x-www-form-urlencoded’)

  1. import axios from 'axios'
  2. import qs from 'Qs'
  3. let data = {"code":"1234","name":"yyyy"};
  4. axios.post(`${this.$url}/test/testRequest`,qs.stringify({
  5.     data
  6. }))
  7. .then(res=>{
  8.     console.log('res=>',res);            
  9. })


 
(3) ‘Content-Type’= 'application/json
传参格式为 raw (JSON格式)
(全局请求头:‘Content-Type’= ‘application/x-www-form-urlencoded’)
(request的Header:‘Content-Type’= ‘application/json;charset=UTF-8’)

  1. //方法一:
  2. import axios from 'axios'
  3. let data = {"code":"1234","name":"yyyy"};
  4. axios.post(`${this.$url}/test/testRequest`,data)
  5. .then(res=>{
  6.     console.log('res=>',res);            
  7. })
  8.  
  9. //方法二:
  10. var readyData=JSON.stringify({
  11.     id:1234,
  12.     name:user
  13. });
  14. axios.post("/notice",readyData)
  15.      .then((res) => {return res})
  16.      .catch((err) => {return err})

————————————————
版权声明:本文为CSDN博主「海 洋️️」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/weixin_59237016/article/details/124053822

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/AllinToyou/article/detail/426922
推荐阅读
相关标签
  

闽ICP备14008679号