Javascript redux与useffect的交互作用
我正在开发一个函数,它可以人工地将一些数据加载到组件,即根据上传的数据重新创建页面显示。 当调用useEffect时,我面临一些问题。 代码如下:Javascript redux与useffect的交互作用,javascript,reactjs,react-redux,react-hooks,Javascript,Reactjs,React Redux,React Hooks,我正在开发一个函数,它可以人工地将一些数据加载到组件,即根据上传的数据重新创建页面显示。 当调用useEffect时,我面临一些问题。 代码如下: const funcA = (props) => { let a = [1, 2, 3]; let b = [2, 3]; setSelected(a); setParam(b); return ( <div>...</div> ); } const funcB
const funcA = (props) => {
let a = [1, 2, 3];
let b = [2, 3];
setSelected(a);
setParam(b);
return (
<div>...</div>
);
}
const funcB = (props) => {
useEffect(
() => {
setParam([]);
},
[props.selected]
);
return (<div>...</div>);
}
const funcA=(道具)=>{
设a=[1,2,3];
设b=[2,3];
选举产生(a);
setParam(b);
返回(
...
);
}
常量funcB=(道具)=>{
使用效果(
() => {
setParam([]);
},
[道具选择]
);
回报率(…);
}
setSelected()
和setParam()
是修改我的redux存储的操作。
现在,当我在funcA
中使用setSelected()
更改selected
时,在funcB
中调用useEffect,它根据所选的值修改参数
数据。
我认为这不应该是一个问题,因为我在调用setSelected
之后调用setParam()
,但似乎useffect
在setParam()之后执行
长话短说,这就是我希望他们执行的顺序:
选举产生()
useEffect()(由于选定项中的更改)
setParam()
但它们是按以下顺序执行的:
选举产生()
setParam()
useEffect()(由于选定项中的更改)
感谢您的帮助。谢谢 在react世界中,通常不应该依赖于setSomething()函数的调用顺序
React“收集”状态更新调用,并决定更新状态的最有效方式
不要按“呼叫顺序”思考,你应该考虑“如果状态A是X,那么状态B应该是什么?”。
与“如果用户单击,则更改状态”不同,请考虑“用户希望获得/看到什么?”
不好:
选举产生()
useEffect()(由于选定项中的更改)
setParam()
更好:
选举产生()
useEffect()(调用setParam(),因为所选内容发生了更改)
useEffect()(调用setParam(),因为…为什么?)
您可能需要重新考虑,并稍微改变您的状态结构。您能显示调用funcA
和funcB
的位置吗?使您的操作异步,因为当任何操作需要时间时,javascript都会消失,请查看链接-,您还可以看到本教程-@RedBaron funcA只是一个按钮,而funcB在另一个页面上呈现一个表(这是一个单页应用程序。我的意思是上一个组件已卸载)。因此,当用户单击funcA按钮时,他将被重定向到页面,其中包含funcB中的表以及加载的数据(我们在存储中修改的内容)为什么要将param设置为b
,然后立即将其设置为用户效果中的空数组?@RedBaron useffects在通常情况下设置param的默认值,但这里我想使用funcA重新创建一个包含一些数据的页面。另外,我不希望它被设置为空数组(默认值),我希望它被设置为[2,3],它来自我加载的数据。在尝试了几件事情后,我只是这样做,删除了useffect(),并更改了我更新变量的位置。非常感谢@kicia