vue发送请求遇到的坑

先看错误信息：

后台一直接受不到参数 参数缺失

问题所在

有些时候使用application/x-www-form-urlencoded，也就是大家在项目经常用到的一种提交格式
有些时候使用application/json提交数据，也很常用
本人在开发过程中呢
一般使用application/x-www-form-urlencoded格式提交数据来查询
使用application/json格式来增加数据和修改数据

解决方法

途径1：设置请求头 并且将 对象参数 转换为查询参数类型（qs）

//配置axiox
import axios from 'axios'
axios.defaults.baseURL = 'http://127.0.0.1:8088/'
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'
axios.defaults.transformRequest = [function (data) {
  let ret = ''
  for (let it in data) {
    ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
  }
  return ret
}]
//挂载vue原型对象
Vue.prototype.$http = axios

然后再发送请求

  submitForm() {
            this.$refs.login.validate( async valid => {
                if (valid) {
					//发起登录请求
					const {data:res} = await this.$http.post("manage/login",this.loginForm);
					console.log(res);
                    this.$message.success('登录成功');
                    localStorage.setItem('ms_username', this.loginForm.username);
                    this.$router.push('/');
                } else {
                    this.$message.error('请输入账号和密码');
                    console.log('error submit!!');
                    return false;
                }
            });
        },

请求成功！

途径2：安装qs工具

1.安装qs，首先cmd开起来，cd到你的项目根目录，执行以下命令

npm install qs --save

2.在main.js中进行导入qs，交给vue进行使用

import qs from 'qs'
Vue.prototype.$qs = qs;

3,请求时将参数

qs.stringify(参数对象)

成功！！！