react axios 传参为 FormData

骑猪看日落 2023-07-18 02:29 6阅读 0赞

## react axios 请求 传参为 FormData 目前本人用过两种方法 ##

##### 方法一 : #####

import axios from 'axios'
    
    var formData = new FormData()
    let msg = { 'username':'admin','password':'admin'}
    for (const key in msg) { 
      formData.append(key,msg[key])
    }
    axios({ 
      method: 'POST',
      url: '请求路径',
      data: formData
    }).then(res => { 
      console.log(res)
    })

##### 方法二 : #####

(1) 新建一个 http.js 文件

import axios from 'axios'
    import qs from 'qs'
    
    let http = { 
        post: '',
        get: ''
    }
    http.post = function(api,data) { 
        let params = qs.stringify(data)
        return new Promise((resolve, reject) => { 
            axios.post(api,params).then(res => { 
                resolve(res)
            })
        })
    }
    http.get = function(api,data) { 
        let params = qs.stringify(data)
        return new Promise((resolve, reject) => { 
            axios.get(api,params).then(res => { 
                resolve(res)
            })
        })
    }
    export default http;

(2) 在需要获取数据的页面

async login() { 
        const res = await http.post('路径',{ 'username':'admin','password':'admin'})
        console.log(res)
    }

此方法只封装了 post 和 get 两个方法 , 如用到 delete 等请求方式可试着封装成一个方法

发表评论取消回复

表情：

评论列表（有 0 条评论，6人围观）

还没有评论，来说两句吧...

相关阅读

相关 axios之post传参

后台说：传参post用body的形式 var str={ "User":_this.addform, ...

妖狐艹你老母/ 2024年04月18日 20:55/ 0 赞/ 63 阅读

相关 axios之get传参

近遇到了get传参的几种格式，想在这里总结一下，有不对的可以告诉我，我会改的~ 后台说：以url的形式传参先上图吧：看看后台的需求 ![在这里插入图片描述]...

电玩女神/ 2024年04月18日 12:16/ 0 赞/ 71 阅读

相关 axios.get请求传参方式

GET 请求中的数据通常通过查询参数（query parameters）传递，而不是在请求体中传递将数据作为查询参数附加到 URL 上 axios.get('

左手的ㄟ右手/ 2024年03月02日 10:51/ 0 赞/ 59 阅读

相关 react axios 传参为 FormData

react axios 请求传参为 FormData 目前本人用过两种方法方法一 : import axios from 'axios'

骑猪看日落/ 2023年07月18日 02:29/ 0 赞/ 7 阅读

相关 axios常见传参方式

[https://www.cnblogs.com/zhaojunhao/p/9622004.html][https_www.cnblogs.com_zhaojunhao_p_

冷不防/ 2023年06月30日 09:07/ 0 赞/ 3 阅读

相关 axios的传参方式

[https://www.cnblogs.com/liangweiping/p/11533162.html][https_www.cnblogs.com_liangweipin

柔光的暖阳◎/ 2023年06月30日 09:06/ 0 赞/ 1 阅读

相关前端上传文件使用FormData给后端传参

这个传参格式已经没什么说的价值了，因为从业的人肯定都用过，但是啊，但是今天有人问我了，所以再说说吧首先，先把参数转换为`new FormData()`： let

r囧r小猫/ 2022年12月30日 13:45/ 0 赞/ 284 阅读

相关 vue-axios传参

get请求,参数是对象 getHospList (page, limit, searchObj) { return request({

叁歲伎倆/ 2022年09月15日 12:44/ 0 赞/ 185 阅读

相关 vue axios FormData 前端上传文件

vue 使用原生input + FormData上传文件不用表单提交，form表单提交页面会跳转 <input type="file" ref="fil

朱雀/ 2022年09月12日 01:43/ 0 赞/ 223 阅读

相关 react props传参配置

1、引入库 import xx from 'prop-types'; 2、配置参数信息(不符合只会报警告,不会中断程序) 类组件

以你之姓@/ 2021年07月24日 18:49/ 0 赞/ 451 阅读