• vue使用axios调用api接口 ---- 关于qs序列化


    常见的Content-Type: application/x-www-form-urlencoded 当设置好Content-Type参数不进行序列化你会发现还是走的json方式请求。

    举例:

    var params = {
                        pageIndex : that.packnowpage,
                        customName : that.packsearchinfo,
                    };
                    that.$axios
                    .post(`${this.$APIURL}/upgradePackage/list`,params,{headers:{'Content-Type':'application/x-www-form-urlencoded'}})
                    .then(response => {
                        const { data } = response                
                        if(data.code=="0")
                        {
                            console.log(data);
                            //赋值
                            that.packData = data.data.list;
                            that.packnowpage = data.data.pageNum;
                            that.packcountpage = data.data.pages;                  
                        }
                        else
                        {
                            this.$message.error(data.msg);
                        }
                    }).catch(error => {
                        this.$message.error(error);
                    })
    that.$axios.post(
    `${this.$APIURL}/upgradePackage/list`,
    params,
    {headers:{'Content-Type':'application/x-www-form-urlencoded'}})

    正确写法:
    that.$axios.post(
    `${this.$APIURL}/upgradePackage/list`,
    qs.stringify(params),
    {headers:{'Content-Type':'application/x-www-form-urlencoded'}})




    关于qs

    在项目中使用命令行工具输入:npm install qs
    安装完成后在需要用到的组件中:import qs from 'qs’
    具体使用中我查看了:qs.parse()和qs.stringify()

    这两种方法虽然都是序列化,但是还是有区别的。
    qs.parse()是将URL解析成对象的形式
    qs.stringify()是将对象 序列化成URL的形式,以&进行拼接

    解决我遇到的问题我使用了qs.stringify()





  • 相关阅读:
    专题实验 Toad 用户的创建与管理( 包括 role 等 )
    专题实验 字符集(全球化支持)
    Toad 所有 菜单说明(太多)
    java 调试
    java 基础数据结构
    HeadFirst Jsp 09 (JSTL)
    HeadFirst jsp 08 无脚本JSP
    14 多线程
    Struts2配置
    Struts框架搭建时所遇到的问题
  • 原文地址:https://www.cnblogs.com/JoeYD/p/13665480.html
Copyright © 2020-2023  润新知