axios请求数据如下几种方式的区别，以及在封装的axios方法中如何传递同第一种情况相同的参数？

Question

公司现在进行前后端分离项目，我前端亲求数据用的是axios方法，现有如下集中请求接口的数据方式，只有第一种和第三种能够请求成功，但是明显两种传递的数据不一样，由于自己不是很明白其中的原理，所以在此提问，希望各位大神能指点一二。

登陆接口可以成功请求到数据的情况如下：
请求方式：

请求响应：

请求返回参数：

封装好的axios请求方式的参数如下：
第一种情况：
调用封装的方法如下：

封装的方法如下：

返回的结果如下，服务器内部报错，前端传递的数据格式与成功请求的格式不一致！！！

第二种情况：调用的封装方法不变，将封装方法的参数形式修改，情况如下：

第三种情况：

Answer 1

这里成不成功只取决于后端能处理的Content-Type。换个后端哪个对哪个错就不一定了。

Answer 2

修改下第一种封装过的方法：

export function login(username, password) {
  return request({
       url: '...',
       method: '...',
       // 代码区别在这里
       // axios post请求默认的 Content-type 就是 x-www-form-urlencoded,此时是 data 选项
       // 如果是 get 请求的化，就是 params 选项
       data: {
           username,
           password
       } 
   })  
}