JS async/await-ajax異步請求等待返回數據
- 例子使用的是 axios 做ajax請求
- 在vue中使用
定義方法
// 應用自定義了封裝了一些內容axios
import Axios from '../axios'
// 這個對象是為了方便暴露出去
const ajax= {
// 定義一個普通方法
get: (url) => {
//主要內容在這里 在方法中返回一個Promise
// 使用Promise的resolve返回需要異步獲取的對象即可
return new Promise((resolve, reject) => {
Axios ({
method: 'get',
url: url
}).then(response => {
// 成功返回
resolve({data: response.data})
}).catch(error => {
// 失敗返回
resolve({data: error})
})
})
}
}
export default {
...ajax
}
使用
- 主要使用async/await關鍵字
- 定義方法使用async 修飾方法
- 調用方法使用await修飾 (前提是調用的方法必須是放回Promise)
import ajax from '../commonJs/ajax'
async goodsCategoryData() {
// 使用異步請求獲取返回數據
let data = await ajax.get('/goods')
console.log('測試獨立ajax', data)
},
總結
- 定義方法寫的有點多是我自己的一點記錄,其實就是一個普通的方法
