Vue axios post传值到后台时获取不到

最新推荐文章于 2024-08-09 11:13:50 发布

DIVI_ZHANG

最新推荐文章于 2024-08-09 11:13:50 发布

阅读量4.1k

点赞数 2

CC 4.0 BY-SA版权

分类专栏： vue

本文链接：https://blog.youkuaiyun.com/qq_36091581/article/details/80499150

vue 专栏收录该内容

11 篇文章

订阅专栏

在Vue中使用axios进行POST请求时，遇到后台无法获取参数的问题。解决方法是引入qs模块，通过qs.stringify()转换参数，并在axios配置中设置headers。详细步骤包括安装qs模块，修改main.js配置，以及展示axios的post请求示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Vue axios post传值到后台时获取不到

Axios post 参数为null

解决：

引用qs, 安装qs模块 (npm install –save qs)
main.js 里的代码截图

同时要在main里加上这个head

axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'

下面送上我的axios调用方法：

this.$post('https://xxx.action',
        this.$qs.stringify({a: '2'})).then((response) => {
        console.log(response)
        this.$notify({
          title: '成功',
          message: response.errorCode,
          type: 'success'
        })
      }).catch((response) => {
        console.log(response)
        let errorData = ''
        if (response.response === undefined) {
          errorData = response.errorMsg
        } else {
          errorData = response.errorMsg
        }
        this.$notify.error({
          title: '失败',
          message: errorData
        })
      })

* 题外话

post 传参数有两种格式，一种是字符串，一种是json

1.字符串

let params = new URLSearchParams();
params.append('age', '24');

JSON
由于axios默认发送数据时，数据格式是Request Payload，而并非我们常用的Form Data格式，后端未必能正常获取到，所以在发送之前，需要使用qs模块对其进行处理。

// 如上面axios用法里参数的处理一样

至此，数据返回成功