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

关于这个问题

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
}
    

结束~

相关推荐
张拭心5 分钟前
拭心 7 月日复盘|个体在 AI 时代的挑战
前端
这是个栗子15 分钟前
express-jwt报错:Error: algorithms should be set
前端·npm·node.js
Dolphin_海豚18 分钟前
vapor 的 IR 是如何被 generate 到 render 函数的
前端·vue.js·vapor
小妖66622 分钟前
Next.js 怎么使用 Chakra UI
前端·javascript·ui
胡西风_foxww28 分钟前
从数据丢失到动画流畅:React状态同步与远程数据加载全解析
前端·javascript·react.js·同步·异步·数据·状态
初遇你时动了情1 小时前
JS中defineProperty/Proxy 数据劫持 vue3/vue2双向绑定实现原理,react 实现原理
javascript·vue.js·react.js
阿华的代码王国1 小时前
【Android】RecyclerView实现新闻列表布局(1)适配器使用相关问题
android·xml·java·前端·后端
汪子熙2 小时前
Angular 最新的 Signals 特性详解
前端·javascript
Spider_Man2 小时前
前端路由双雄传:Hash vs. History
前端·javascript·html
南方kenny2 小时前
CSS Grid 布局:从入门到精通,打造完美二维布局
前端·javascript·css