我正在做一個待辦事項應用程序。這是違規代碼的非常簡化的版本。我有一個復選框： <p><input type="checkbox" name="area" checked={this.state.Pencil} onChange={this.checkPencil}/> Writing Item </p>這是調用復選框的函數：checkPencil(){ this.setState({ pencil:!this.state.pencil, }); this.props.updateItem(this.state);}updateItem是映射為分派到redux的函數function mapDispatchToProps(dispatch){ return bindActionCreators({ updateItem}, dispatch);}我的問題是，當我調用updateItem操作并在console.log狀態時，它總是落后1步。如果未選中該復選框且該復選框不為true，則我仍將狀態為true傳遞給updateItem函數。我需要調用另一個函數來強制狀態更新嗎？
3 回答
狐的傳說
TA貢獻1804條經驗 獲得超3個贊
您應該將第二個函數作為setState的回調來調用，因為setState異步發生。就像是：
this.setState({pencil:!this.state.pencil}, myFunction)
但是在您的情況下，由于您希望使用參數來調用該函數，因此您將不得不變得更有創造力，并且可能創建自己的函數來在道具中調用該函數：
myFunction = () => {
this.props.updateItem(this.state)
}
將它們結合在一起，它應該可以工作。
慕勒3428872
TA貢獻1848條經驗 獲得超6個贊
setState()由于各種原因（主要是性能），React中的調用是異步的。在幕后，React將把多個調用分批處理setState()成一個狀態突變，然后一次重新渲染組件，而不是針對每個狀態更改重新渲染。
幸運的是，解決方案非常簡單- setState接受回調參數：
checkPencil(){
this.setState({
pencil:!this.state.pencil,
}, function () {
this.props.updateItem(this.state);
}.bind(this));
}
添加回答
舉報
0/150
提交
取消