如何更新redux切片

Question

我有一个问题，我不能用这个代码更新用户的gold。我想每10秒将用户的金币从当前的金币更新为当前的金币+100。

这个代码不起作用，我想我误解了什么，但不知道是什么！我想在离开页面时发送黄金。我的意思是，例如，我的当前黄金显示在标题中，在页面中，我可以从0开始每10秒看到我的黄金更新一次。。。一旦我在标题中离开页面，我想让我的当前黄金+黄金收入。

我的组件中的useEffect：

const [chrono, setChrono] = useState<number>(0);
const user: any = useSelector((state: any) => state.user);
const dispatch = useDispatch();
const [gold, setGold] = useState(0);
useEffect(() => {
const updateGold = setInterval(() => {
setGold((gold) => gold + 100);
}, 10000);
return () => {
dispatch(
userSlice.actions.update({
...user,
gold: user.gold + gold,
})
);
clearInterval(updateGold);
};
}, []);

减速器

update: (state: any, { payload }) => {
console.log("action =>", payload);
return {
...state,
...payload,
};
},

Answer 1

我认为在间隔上调度更新操作更合理，也更简单，而不是稍后更新本地状态和同步状态。

示例：

const dispatch = useDispatch();
useEffect(() => {
const updateGold = setInterval(() => {
dispatch(
userSlice.actions.addGold(100);
);
}, 10000);
return () => {
clearInterval(updateGold);
};
}, []);

切片

addGold: (state: any, { payload }) => {
state.gold = state.gold + payload;
},