useState 更新状态值，但将旧值作为参数传递给函数

Question

使用 useState 钩子，我更新了组件的状态(我用它来切换带有 react-spring 的动画)，我想将状态的值发送到 redux 存储，以便我可以在另一个组件上使用它。

问题在于，虽然 useState 钩子按预期工作，但它作为参数传递给获取调度的操作的值与状态相反。

由于从存储中获取值的另一个组件仍然可以正常工作(但始终以相反的方式切换)，因此我认为这不是动作/化简器问题。

useState 初始化为 false。 单击更新 useState 值。 使用状态值已正确更新。 然后将值作为参数传递给 redux 操作，该操作变为 false 而不是 true。

export const UnconnectedMenuToggle: React.FC<INT.IToggleMenuProps> = ({
getToggleMenuRequest }): JSX.Element => {
const [isMenuOpen, setMenuOpen] = useState<boolean>(false);
const btnAnimation = useSpring<INT.IAnimateToggle>({
transform: isMenuOpen
? `translate3d(300px,0,0)`
: `translate3d(0px,0,0)`
});
const imgAnimation = useSpring<INT.IAnimateToggle>({
transform: isMenuOpen
? `rotate(0deg)`
: `rotate(540deg)`
});
const makeBoolGlobal = (): void => {
setMenuOpen(isMenuOpen => !isMenuOpen)
getToggleMenuRequest(isMenuOpen)
}
return (
<a.button
data-test="button-toggle"
className="menu-button"
onClick={makeBoolGlobal}
style={btnAnimation}
type="button"
>
<a.img src={chevron}
data-test="img-toggle"
alt="Open Menu"
style={imgAnimation}
/>
</a.button>
)
}

无错误消息

Answer 1

由于新的钩子 setState 方法没有回调，因此您必须在状态更新后使用 useEffect 来制作函数

const [count, setCount] = useState(0)
useEffect(() => doSth(count))