用axios來實現資料請求
阿新 • • 發佈:2018-12-16
cdn載入
<script src="https://unpkg.com/axios/dist/axios.min.js"> </script>
get請求
axios.get('/detail?id=10').then(function (res) {
//成功獲取資料
console.log(res);
}).catch(function (err) {
//請求錯誤
console.log(err);
});
get請求也可以通過 params 物件傳遞引數。寫法如下:
axios.get('/detail', { //引數 params: { id: 10 } }).then(function (res) { //成功獲取資料 console.log(res); }).catch(function (err) { //請求錯誤 console.log(err); });
post請求
//執行post請求
axios.post('/add', {
name: '前端君',
age: 26
}).then(function (res) {
//請求成功
console.log(res);
}).catch(function (err) {
//請求失敗
console.log(err);
});
多個請求併發
除了最常用的get請求和post請求以外,值得一提的是axios提供了一次性併發多個請求的API,使用方法如下:
function getProfile(){ //請求1 return axios.get('/profile'); } function getUser(){ //請求2 return axios.get('/user'); } //併發請求 axios.all([ getProfile(), getUser() ]).then(axios.spread((res1, res2)=>{ //兩個請求現已完成 console.log(res1); console.log(res2); }));