2 回答

TA貢獻(xiàn)1872條經(jīng)驗(yàn) 獲得超4個(gè)贊
在第一個(gè)示例中,unmounted總是false在每次渲染之后。
這是不使用全局實(shí)例的正確方法:
function Component() {
const [emailSent, setEmailSent] = useState(false);
const unmounted = useRef(false);
async function handleSendEmail(formValues) {
try {
await AuthApi.sendRecoverAccountEmail('123');
!unmounted.current && setEmailSent(true);
} catch (err) {
!unmounted.current && setIsSendingEmail(false);
}
}
useEffect(() => {
return () => {
unmounted.current = true;
};
}, []);
}

TA貢獻(xiàn)1786條經(jīng)驗(yàn) 獲得超11個(gè)贊
一個(gè)有趣的問題。您可能會(huì)發(fā)現(xiàn)有關(guān)鉤子的常見問題解答很有用,因?yàn)槲艺J(rèn)為它相當(dāng)具體地解決了您的問題。
在第一個(gè)示例中,卸載的var是組件屬性的一部分,而在第二個(gè)示例中,它只是作為javascript閉包的一部分而獲得的。
通常,您要確保將更改的掛載參數(shù)作為componentDidUnmount生命周期方法的一部分。
我認(rèn)為,如果您將unmount添加到依賴項(xiàng)列表中,可能會(huì)起作用嗎?我通常在Clojurescript中使用另一個(gè)框架的react,所以我并不完全熟悉主要javascript接口的語義,但這至少是為什么您會(huì)收到第一個(gè)示例警告的原因。
在第一個(gè)示例中,如果將最后一部分更改為以下內(nèi)容,會(huì)發(fā)生什么?
useEffect(() => {
return () => {
unmounted = true;
};
}, [unmounted]);
}
您可能需要將unmount定義為更正式的react屬性,而不僅僅是組件中包含的屬性。
添加回答
舉報(bào)