es7 async await 为什么会对react setState起作用?setState()并不是一个promise啊!?下面是代码和日志
constructor(props){
super(props);
this.state={
value:this.props.value||this.props.defaultValue||'',
result:true,
}
}
verifier(){
let result;
let{rules} = this.props;
let{value} = this.state;
switch (this.rulesClassify()){
case 'fn' :
result = rules();
break;
case 'reg' :
result = rules.test(value);
break;
default :
result = rules===value;
}
this.setState({
result
});
}
/*
**
@每次变动callback
*/
async handleChange(event){
//受控
let value=event.target.value;
await this.setState({
value
});
debug(this.state.result);
//验证
await this.verifier();
debug(this.state.result);
}
这里验证了input中只能是存数字,当我输入非数字时,如果没有使用 async和await的时候log就会输出两个true,而当使用async和await时,则是上图结果,说明async和await起了作用
答案有了。
1、非常冒昧的去直接询问了@司徒正美 老师,老师的答案是巧合。
2、stackoverflow 上也找到了答案 Why does Async Await work with React setState? (具体看 Davin Tryon的回答 关于regenerator-runtime中_asyncToGenerator)
3、如何合理的解决setState异步带来的困扰,也许大家需要浏览一下这两篇文章,文章里包含了关于setState的官方推荐姿势和为什么setState不返回promise 从 setState promise 化的探讨 体会 React 团队设计思想
setState:这个API设计到底怎么样