displayModal有一个永远都是落后的价值。可能是比赛条件。我updateModal在回调中进行调用，setState因此不会发生竞争状况。
addAccrual: function() {
console.log('setting modal to display true');
this.setState({displayModal: 1}, this.updateModal());
},
saveAddAccrual: function() {
console.log('setting modal to display false');
this.setState({displayModal: 0}, this.updateModal());
},
cancelAddAccrual: function() {
console.log('setting modal to display false');
this.setState({displayModal: 0}, this.updateModal());
},
updateModal: function() {
console.log("state of displayModal: " + this.state.displayModal);
if(this.state.displayModal){
console.log('showing modal');
$('#myModalOverlay').show();
$('#myReactModal').show();
}else{
console.log('hiding modal');
$('#myModalOverlay').hide();
$('#myReactModal').hide();
}
},
例如
设置模式以显示
displayModal的真实状态：0
隐藏Modal
HTML / JSX
<button className="ay-btn" id="addAccrualButton" onClick={this.addAccrual}>Add Accrual</button>
<button className="btn" type="button" onClick={this.cancelAddAccrual}><i className="icon-remove"></i>Cancel</button>
<button className="btn-primary btn" type="button" onClick={this.saveAddAccrual}><i className="icon-white icon-ok"></i>Save</button>
您的问题可能是这样的：
this.setState({displayModal: 1}, this.updateModal());
我假设您要updateModal在成功设置状态后致电。上述行没有做到这一点，因为你正在传递的结果的updateModal作为回调。
更改为：
this.setState({displayModal: 1}, this.updateModal); // no ()
并且您应该看到预期的行为。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句