ES7之async/await异步方案

来源:互联网 发布:剪切的数据怎么恢复 编辑:程序博客网 时间:2024/06/13 21:39

async,异步的意思,这是一种异步方案,es6里经常用的是promise这种异步回调方案,但是每步都要接上.then,因此写的比较繁琐,而ES7中的异步方法async/await则要简单的多,下面举栗子说明用法:
第一,使用规则:
async是个函数,await要在async的里面使用;
await起着拦截的作用,表示只有await后面跟的代码执行完毕方可继续执行下面的代码
第二、栗子:
在一个vue组件中,调取getData.js中封装的axios方法(关于axios的使用和配置我前面的的博客里有简单的说明),发送一次对数据的请求:

getData.js中:

export const cityGuess = () => Vue.prototype.$http.get('http://localhost:8082/v1/cities?type=guess'); // 获取默认城市

script代码(import目录中getData.js里的cityGuess()到这里的代码就不写了):
1,使用async/await获取:

async created () {    let res = await cityGuess();    this.guessCity = res.data;}

2,使用promise获取:

 created () {    cityGuess().then(res => {        this.guessCity = res.data;    });}

两种方法的简易一目了然

原创粉丝点击