3 回答

TA貢獻(xiàn)1828條經(jīng)驗 獲得超6個贊
在您的componentDidUpdate狀態(tài)中,按以下方式更新:
this.setState({ error: true })
您這樣做的條件是:
Object.keys(this.context.errors).includes(this.props.name)
設(shè)置狀態(tài)會導(dǎo)致組件重新渲染并更新,因此componentDidUpdate將再次運行。然而,當(dāng)這種情況發(fā)生時,您的上述情況很可能仍然成立。因此,你將再次更新狀態(tài),React 不會短路狀態(tài)更新,因為你每次都創(chuàng)建一個新對象。在這里拯救自己的一種簡單方法是將您的條件更改為:
if (bad && !this.state.error) {
this.setState({ error: true }); // traceback give me error too.
};

TA貢獻(xiàn)1784條經(jīng)驗 獲得超8個贊
您應(yīng)該在內(nèi)部使用某種類型的條件componentDidUpdate,以免觸發(fā)狀態(tài)更新。就像下面這樣:
componentDidUpdate(prevProps, prevState) {
let bad = Object.keys(this.context.errors).includes(this.props.name);
if (prevState.error !== this.state.error && bad) {
this.setState({ error: true }); // traceback give me error too.
};
};
始終比較內(nèi)部的 prevState 和 currentState 值,componentDidUpdate因為在大多數(shù)情況下這個條件就足夠了。
注意:開始使用之前,componentDidUpdate請參閱文檔,因為它還提供了prevProps在prevState這種情況下始終有用的值。

TA貢獻(xiàn)1844條經(jīng)驗 獲得超8個贊
改變
if (bad) {
this.setState({ error: true }); // traceback give me error too.
};
到
if (bad && !this.state.error) {
this.setState({ error: true }); // traceback give me error too.
};
setState在 of 內(nèi)部使用componentDidUpdate將導(dǎo)致它重新渲染和調(diào)用componentDidUpdate。添加額外的檢查將有助于停止此循環(huán)。
添加回答
舉報