我已阅读 Redux 文档:
“只要函数组件渲染,选择器就会运行(除非自上次渲染组件以来它的引用没有改变,这样钩子就可以返回缓存的结果,而无需重新运行选择器)。useSelector()将还订阅 Redux 存储,并在调度操作时运行您的选择器。”
根据我的理解,只要调度一个动作,选择器就会再次运行。此外,根据文档,他们声明“只要函数组件呈现,选择器就会运行”。如果这是指初始重新渲染,那么这是正确的。但如果这意味着每次重新渲染都运行,我相信这可能不准确。例如,如果状态没有改变(例如将网站主题从浅色切换为深色),重新运行选择器逻辑有什么好处?我已经使用以下代码测试了此场景:
`*
import { useState } from "react";
import CartMangment from "./cartfeatuer/CartMangment";
import UserMangment from "./userfeatuer/UserMangment";
function App() {
const [text, setText] = useState(0);
return (
<div className="flex flex-wrap p-4">
<input type="text" onChange={(e) => setText(e.target.value)} />
<UserMangment />
<CartMangment />
</div>
);
}
export const UserListAbove30Years = (state) => {
console.log("UserListAbove30Years run");
return state.user.userList.filter((user) => user.age > 30);
};
*`
当我使用 setText 更新 中的状态,导致其重新渲染时,所有子级也会渲染,并且 (
console log "UserListAbove30Years run"
) 不会打印在控制台上,尽管由于缺乏记忆而每次都会返回一个新引用。因此,我对文档中的说法感到困惑:“只要函数组件渲染,选择器就会运行。”
Redux 文档中“每当函数组件渲染时选择器都会运行”是什么意思?请澄清我在问题中提到的困惑。
这离你的答案有点远,但我建议你使用 useContext 钩子,因为 redux 很难理解并且使用起来很复杂。 如果您的项目不是那么大,context 将是理想的解决方案。