3 回答

TA貢獻(xiàn)1860條經(jīng)驗(yàn) 獲得超9個(gè)贊
我認(rèn)為問(wèn)題是您正在返回調(diào)用調(diào)度。從 useEffect 返回的函數(shù)是清理函數(shù),所以我認(rèn)為這不會(huì)在掛載或更新時(shí)運(yùn)行 - 僅在卸載之前運(yùn)行。試試這個(gè):
export default function Blog() {
// ...
// Don't return from useEffect. Just call dispatch within the body.
useEffect(() => {
dispatch(fetchBlog(slug);
}, [slug, dispatch]);
// ...
}
https://reactjs.org/docs/hooks-reference.html#cleaning-up-an-effect

TA貢獻(xiàn)1806條經(jīng)驗(yàn) 獲得超8個(gè)贊
我想澄清問(wèn)題是什么,@Trace 引導(dǎo)我找到了。
useEffect沒(méi)有在刷新時(shí)被調(diào)用,因?yàn)樗诮M件渲染/返回后被調(diào)用。刷新時(shí),狀態(tài)(包括博客數(shù)據(jù))丟失;而不是返回,aTypeError被拋出,因?yàn)閐ata.title不存在。所以u(píng)seEffect永遠(yuǎn)不會(huì)有機(jī)會(huì)被調(diào)用并獲取博客的內(nèi)容。
解決方案是這樣的:
export default function Blog() {
// ...
useEffect(/* ... */)
const blog = useSelector((state) => state.blogs[0]);
if (!blog) {
return <p>Loading...</p>
}
// return actual blog contents here
}
所以現(xiàn)在fetchBlog確實(shí)被調(diào)用,更新blog和渲染內(nèi)容。

TA貢獻(xiàn)1848條經(jīng)驗(yàn) 獲得超2個(gè)贊
我不清楚蛞蝓是從哪里來(lái)的。
理論上useEffect在每次渲染后運(yùn)行。如果有多個(gè)參數(shù),它將在第二個(gè)參數(shù)中傳遞的數(shù)組參數(shù)之一發(fā)生更改時(shí)運(yùn)行回調(diào)。
要么創(chuàng)建一個(gè)useEffect空數(shù)組作為第二個(gè)參數(shù)以“一次”運(yùn)行它(例如,當(dāng)您刷新時(shí))或檢查 slug 值。
檢查回購(gòu)后的編輯:
它不起作用,因?yàn)?useEffect 在渲染之后運(yùn)行(盡管有人反對(duì)它,但它包含在我的答案中)。如果之前拋出異常(在本例中為空指針),則調(diào)度調(diào)用只會(huì)在之后發(fā)生,或者根本不會(huì)發(fā)生。
您可以從 react-router 獲取 slug match,可能對(duì)您很方便。
export default function Blog({ match }) {
const slug = match.params.slug;
etc
git repo 顯示了如何將 dispatch as 作為數(shù)組參數(shù)添加到useEffect,這不是必需的。
添加回答
舉報(bào)