写一个项目里遇到的用async语法拿到js返回数据的小例子,demo不全,但是重点逻辑写出来了,想实现的小伙伴自己补全就好了。
js中
let vue = new Vue()
export function getData(ids) {
return new Promise((resolve) => {
vue.resetAjax({
//这里vue的resetAjax是自己项目里用vue.prototype.resetAjax = function(){}封装的,
//用其他的Ajax写法也都是一样的
method: ‘get ‘,
url: ’ ‘+ids,
onSuccess: function(res) { //res即为从后端url拿到的数据
resolve(res.data) //此处获得想要拿到的具体数据
}
})
})
}
vue中js
import { getData } from ” ./factory ” //引入getData方法
…….
methods: {
async myGetData (ids) {
let dataList = await getData(ids)
…..
}
}
之后调用myGetData(ids),即可调用js文件中getData方法,并且async函数结构保证了getData方法执行完毕后,将想要拿到的数据传给了vue中的局部变量dataList,此时再对dataList进行处理就好。
这里主要是async函数结构,我的理解是把异步操作强行变成同步操作,保证了返回到vue中的数据,一定是从Ajax成功处理后返回的数据。

**代码中用到的Promise对象和async函数都是es6中很核心的知识点,但是我还比较菜,也并没有完全掌握它们,只知道基本,需要详细学习的请看“es6阮一峰“的系统讲解**
Logo

前往低代码交流专区

更多推荐