记使用axios请求easy-mock数据时碰到的问题

记使用axios请求easy-mock数据时碰到的问题

第一次使用axios带参数来请求easy-mock模拟的数据，碰到一个问题：返回值不能正确返回。
查阅相关资料后，发现是content��Type的问题
axios默认使用Content-Type: application/json; charset=utf-8方式来发送数据，easy-mock的相应方式也是Content-Type: application/json; charset=utf-8，但是使用如下easy-mock的响应数据格式，不能正确返回数据

axios

axios.post('https://easy-mock.com/mock/5a28f3c05f502a311f5cdb04/getNewsList/load', {
    'name': this.usernameModel
}).then(data => {
    console.log(data);
}).catch(error => {
    console.log(error);
});

easy-mock

{
    success: true,
    data: {
        default: '用户名错误',
        _req: function({ _req }) {
            return _req
        },
        name: function({ _req }) {
            if (_req.query.name === 'admin') {
                return _req.body.name
            } else {
                return this.default
            }
        }
    }
}

后来修改axios的数据请求格式为application/x-www-form-urlencoded，easy-mock修改_req.query.name成_req.body.name后，可以正确接收到返回值。

贴上正确完整的�代码：

axios部分

import qs from 'qs'; //使用qs库处理axios请求的数据格式为application/x-www-form-urlencoded
axios.post('https://easy-mock.com/mock/5a28f3c05f502a311f5cdb04/getNewsList/load', qs.stringify({
    'name': this.usernameModel
})).then(data => {
    console.log(data);
}).catch(error => {
    console.log(error);
});

easy-mock部分

{
  success: true,
  data: {
    default: '用户名错误',
    _req: function({
      _req
    }) {
      return _req
    },
    name: function({
      _req
    }) {
      if (_req.body.name === 'admin') {
        return _req.body.name
      } else {
        return this.default
      }
    }
  }
}