我在我的react应用程序中使用了redux-toolkit。我在react组件中使用了useController & useDispatch来管理组件控制的状态。在react组件之外,我还调用了js代码中的dispatch函数(意思是在react组件之外)来更新状态。
我面临的问题是,在这个函数中,我一次运行多个分派。这导致我的组件在每次分派时更新的usecom。我如何批量处理所有这些分派,以便usecom只重新呈现react组件一次?
下面是我的代码的一个例子。假设react组件“counter”有以下内容:
const count = useSelector(state => state.count)
const title = useSelector(state => state.title)
const name = useSelector(state => state.name)
字符串
现在让我们假设在我的react组件之外,我有一个全局窗口函数,它调用多个函数:
window.foo = () => {
function1();
function2();
function3();
}
型
现在让我们假设function 1()、function 2()、function 3()中的每一个都调用redux分派函数来更新状态的标题、名称和计数。
目前,我的组件将重新呈现3次,为每个usearches我使用。我希望usearches只重新呈现一次时,所有3个分派已经被调用。
我知道react-redux batch函数,但我正在寻找另一种解决方案,因为我不想强迫自己只在一个函数中调用dispatch。有没有一种方法可以延迟redux在执行其队列中的所有dispatch之前等待的默认“等待”时间,我可以增加它?
P.S.我假设必须有某种“等待期”,因为redux dev tools扩展暗示了这一点。另外,从个人测试中我注意到,如果你连续两次调用dispatch(),use selector只会被调用一次,因此我相信redux必须有某种等待期。
1条答案
按热度按时间5ktev3wc1#
我认为你的理解是错误的。在Redux中,
dispatch()
函数不应该被看作是一个setter。相反,你应该用它来说明发生了什么事情,reducer会对这个事件做出React。Redux的创始人Dan Abramov在几年前就这样说过。
如果你的actions creator名称以set* 开头,并且你经常在一行中调用multiple,那么你可能会错过使用Redux的要点。
关键是将“发生了什么”与“状态如何变化”脱钩。“设置者”动作创建者挫败了目的,将两者混为一谈。
在您的示例中,修复方法是只发送一个调度调用,并让多个reducer侦听它。