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

Question

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

class Edit extends Component{
    constructor(){
    }
    async componentWillMount(){
        await someMethod();
    }
    render(){
    }
}

Answer 1

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

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

Answer 2

加了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函数 只保证其内部是同步