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

酱酱子耶2025-04-29 17:26

关于这个问题

js 复制代码

// 父组件
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>

js 复制代码

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

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

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

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

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

js 复制代码

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

结束~