vue post application/x-www-form-urlencoded如何实现传参

更新时间：2024年04月27日 15:08:43 作者：心若向阳无谓悲伤

这篇文章主要介绍了vue post application/x-www-form-urlencoded如何实现传参问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

vue post application/x-www-form-urlencoded传参

在使用axios进行参数获取时，始终获取不到，但是调用postman是正常的，所以初步估计是参数格式不正确，那么正确的应该怎么写呢？

一般按照正常的逻辑，我们在传递application/x-www-form-urlencoded时，参数应该这样写，但实际操作中发现一只获取不到参数。

  axios.create({
        baseURL: 'url',
        timeout: 10000,
        headers: { 'Content-Type': 'application/json' }
      }).post('xxx/xxx/xxx',JSON.stringify({
          name:'',
          age:12
        }),{
          headers:{
            'Content-Type': 'application/x-www-form-urlencoded'
          }
        }).then(function(response){
          console.log(JSON.stringify(response));
        }).catch(function(error){
          console.log(error);
        });

只需要添加两句代码，就可以正常获取啦.

var qs = require('qs');

然后把JSON.strinify改为qs.stringify就可以了。

var qs = require('qs');  
axios.create({
        baseURL: 'url',
        timeout: 10000,
        headers: { 'Content-Type': 'application/json' }
      }).post('xxx/xxx/xxx',qs.stringify({
          name:'',
          age:12
        }),{
          headers:{
            'Content-Type': 'application/x-www-form-urlencoded'
          }
        }).then(function(response){
          console.log(JSON.stringify(response));
        }).catch(function(error){
          console.log(error);
        });

用VUE"application/x-www-form-urlencoded"传值问题

这边我用的是VUE 描述"application/x-www-form-urlencoded"传值问题

var qs = require('qs')
      let param = {
        'ids':id
      };
      let token = window.localStorage.getItem("token");
      axios
        .post(api.purchase, qs.stringify(param), {
          headers: {
            "Content-Type": "application/x-www-form-urlencoded",
            Authorization: token
          }
        })
        .then(res => {
          console.log(res.data);
          //   Toast("程序异常，请稍后再试");
        });
    },

把JSON.strinify改为qs.stringify就可以了

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

详解如何在vue项目中使用eslint+prettier格式化代码
在开发中我们需要一种能够统一团队代码风格的工具，作为强制性的规范，统一整个项目的代码风格，这篇文章主要介绍了详解如何在vue项目中使用eslint+prettier格式化代码，需要的朋友可以参考下
2018-11-11
Vue脚手架配置代理服务器的两种方式(小结)
本文主要介绍了Vue脚手架配置代理服务器的两种方式(小结)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2023-01-01
vue实现移动端原生小球滑块
这篇文章主要为大家详细介绍了vue实现移动端原生小球滑块，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-03-03
基于vue-cli3+typescript的tsx开发模板搭建过程分享
这篇文章主要介绍了搭建基于vue-cli3+typescript的tsx开发模板,本文通过实例代码截图的形式给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
2020-02-02
vue3+vite兼容低版本的白屏问题详解(安卓7/ios11)
这篇文章主要给大家介绍了关于vue3+vite兼容低版本的白屏问题的相关资料,还给大家介绍了vue打包项目以后白屏和图片加载不出来问题的解决方法,需要的朋友可以参考下
2022-12-12
Vue OptionsAPI与CompositionAPI的区别与使用介绍
OptionsAPI和CompositionAPI是Vue.js框架中两种不同的组件编写方式,OptionsAPI通过对象字面量定义组件,以属性分隔不同功能,响应式数据通过data属性定义,本文给大家介绍Vue OptionsAPI与CompositionAPI的区别,感兴趣的朋友一起看看吧
2024-10-10
浅谈在Vue-cli里基于axios封装复用请求
这篇文章主要介绍了浅谈在Vue-cli里基于axios封装复用请求，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-11-11
vue中使用cookies和crypto-js实现记住密码和加密的方法
这篇文章给大家介绍一下关于vue中使用cookies和crypto-js如何实现密码的加密与记住密码，有一定的参考价值，有需要的朋友可以参考一下，希望对你们有所帮助。
2018-10-10
vue+iview分页组件的封装
这篇文章主要为大家详细介绍了vue+iview分页组件的封装，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-11-11
Vue 日期获取的示例代码
moment.js是一款现在对时间处理的强大的函数，这篇文章主要介绍了Vue 日期获取的示例代码，代码简单易懂，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
2023-01-01