异步等待es6优化

时间:2018-02-06 10:55:31

标签: javascript asynchronous ecmascript-6 async-await ecmascript-2017

我正在尝试使用async / await并且我的代码有效,我只需要建议是否是使用async / await的正确方法,或者我需要.then  这里。我有一个函数loadDataForExport - 返回带有生成数据的promise。另外,我有actionButtons异步事件函数,我使用asyn / await,因为在其他情况下let data = loadDataForExport() - 返回promise。

loadDataForExport = async () => {
            const {sort, search} = this.state
            let dataForExport = await this.props.load({pageSize: this.props.totalCount, skip: 0, sort, search}).then(({entities: {devices, rooms}}) => Object.values(devices).map(({deviceType, deviceId, name, version, location, lastAliveMessage, deviceStatus}) => ({
                deviceType,
                deviceId,
                name,
                currentVersion: version,
                location: location && rooms[location] ? rooms[location].name : '',
                lastAliveMessage,
                deviceStatus,
            })))

            return dataForExport
        }


const actionButtons = loadDataForExport => [
    {
        event:  async () => {
            let data = await loadDataForExport()
            exportToExcel(data)
        },
        name: 'exportToExcel',,
    },
]

1 个答案:

答案 0 :(得分:3)

从我(太少)了解async / await如何工作,你正在以正确的方式做到这一点。我相信以下情况属实,如果我错了,请随时纠正我(我已准备好支付一些downvotes以更好地了解它是如何工作的):

Await将等待(通过生成器)在执行async函数的下一个语句之前解析给定的promise。

因此,let dataForExport = await this.props.load(...)会将已解析的this.props.load(...)值分配给dataForExport

异步函数loadDataForExport将返回一个承诺,该承诺将使用dataForExport的值解析或拒绝被拒绝的this.props.load()的值,您可以使用它等待在loadDataForExport.event()

中进行