async没有了await会发生什么?实际问题

1,239 阅读1分钟

关于这个问题

// 父组件
const getFormData = async () => { 
    importForm.validateFields().then((values) => { 
    const params = { 
        MaNO: values?.MaNO, 
        InvoiceNO: values.InvoiceNO, 
        Destination: values?.Destination 
    } 
    console.log('params111'); 
    return params 
    }
    )
}

<ImportFileComponent 
    getFormData={getFormData} 
     <Button>按钮<Button>
</ImportFileComponent>
// 子组件
const onConfirm = async () => { 
    const dataValue = getFormData?.() 
    console.log(dataValue, 'dataValue'); 
}

1.抛出问题:当父组件传这个方法给子组件调用的时候,拿不到返回的params,而是一个promise

2.问题原因:父组件的async走完之后并没有等到await,返回的值在.then()里面的,所以导致他实际返回的是一个Promise

3.解决问题:既然找到了问题所在,那么直接使用await拿到值,使用同步的方式处理异步的代码,或者可以使用两个then,但是那样有些麻烦。

所以,正确的写法是这样的,父组件的方法处理下写

 // 父组件
 const getFormData = async () => { 
    const values = await importForm.validateFields() 
    const params = {
        MaNO: values?.MaNO, 
        InvoiceNO: values.InvoiceNO, 
        Destination: values?.Destination 
    } 
    console.log('params111'); 
    return params
}
    

结束~