美文网首页
axios使用注意事项

axios使用注意事项

作者: 828a8863cef9 | 来源:发表于2018-06-01 15:49 被阅读0次

1、在使用GET方法传递参数时使用的是params,params传参是以/user?ID=1001&name=qq形式传递的;

axios.get('/user?ID=1001')
    .then( res => {
         // 请求数据成功并返回数据。
        console.info(res)
    }).catch( e => {
        console.info(e.config)
    })
// 等同以下写法
axios({
    url: '/user',
    method: 'GET',
    params: {
        ID: 1001
    }
}).then( res => {
    console.info(res)
}).catch( e => {
    console.info(e)
})

2、使用POST时对应的传参使用的是data,data是作为请求体发送的,同样使用这种形式的还有PUT,PATCH等请求方式;

axios.post('/user', {
    firstName: 'Qi',
    lastName: 'Rong'
}).then( res => {
    console.info(res)
}).catch( e => {
    console.info(e)
})
// 等同以下写法
axios({
    url: '/user',
    method: 'POST',
    data: {
        firstName: 'Qi',
        lastName: 'Rong'
    }
}).then( res => {
    console.info(res)
}).catch( e => {
   console.info(e)
})

3、axios中POST的默认请求体类型为Content-Type:application/json,
同时,后台必须要以支持@RequestBody的形式接收参数,否则会出现前台传参正确,后台接收不到的情况;

4、POST如果想要设置类型为Content-Type:application/x-www-form-urlencoded(浏览器原生支持),axios提供了两种方式:
(1)浏览器端,并不是所有浏览器都支持URLSearchParams。

const params = new URLSearchParams();
params.append('firstName', 'Qi');
params.append('lastName', 'Rong');
axios.post('/user', params);

(2)用qs这个库来格式化数据。默认情况下在安装完axios后就可以使用qs库。

const qs = require('qs');
axios.post('/user', qs.stringify({'firstName':'Qi', 'lastName': 'Rong'}));

相关文章

网友评论

      本文标题:axios使用注意事项

      本文链接:https://www.haomeiwen.com/subject/sykksftx.html