Axios,基于 Promise 的 HTTP 客户端,可以工作于浏览器中,也可以在 node.js 中使用。
1.通用方式
①发起 GET 请求:
axios({
// 请求方式
method: 'GET',
// 请求的地址
url: '',
// URL 中的查询参数
params: {
id: 1
}
}).then(function (result) {
console.log(result)
})
②发起 POST 请求:
document.querySelector('#btnPost').addEventListener('click', async function () {
// 如果调用某个方法的返回值是 Promise 实例,则前面可以添加 await!
// await 只能用在被 async “修饰”的方法中
// 使用解构赋值,从 axios 封装的大对象中,把 data 属性解构出来
// 把解构出来的 data 属性,使用 冒号 进行重命名,一般都重命名为 { data: res }
const { data: res } = await axios({
method: 'POST',
url: '',
data: {
name: 'zs',
age: 20
}
})
console.log(res)
})
2.直接方式
①直接发起GET请求
document.querySelector('#btnGET').addEventListener('click', async function () {
/* axios.get('url地址', {
// GET 参数
params: {}
}) */
const { data: res } = await axios.get('http:....', {
params: { id: 1 }
})
console.log(res)
});
②直接发起POST请求
document.querySelector('#btnPOST').addEventListener('click', async function () {
// axios.post('url', { /* POST 请求体数据 */ })
const { data: res } = await axios.post('http:...', { name: 'zs', gender: '女' });
console.log(res);
});