React的生命周期函数前面能加async吗?

ygtzz
  • 547

看有的代码这么写,还能运行,生命周期钩子加async,不太理解这种行为,不说componentWillMount是同步的,在render前面执行,这样不会阻塞吗?

class Edit extends Component{
    constructor(){
    }
    async componentWillMount(){
        await someMethod();
    }
    render(){
    }
}
回复
阅读 2.5k
2 个回答
✓ 已被采纳

当然可以加,加了 async/await 后生命周期函数内的异步操作就是同步了,但不影响生命周期本身。比如你的代码依然是componentWillMount()执行完了才执行render()。

补充:异步组件加载就是利用 async/await,配合动态import实现的

加了async只能保证函数内部是同步

function getData(){
    new Promise((resolve)=>{
        setTimeout(()=>{
            resolve()
        },2000)
    })
}

async function foo(){
  console.log(1)
  await getData()//2秒的请求操作
  console.log(2)
}

foo().then(()=>{})
console.log(3)

// 1 3
// 两秒后
// 2

foo 对外还是一个正常的Promise函数 只保证其内部是同步

宣传栏