如何在react redux中破坏redux状态

Question

我不明白在...state中使用...的意义。当我看过react redux的教程时，他们提到它是状态变量的析构函数，但你能解释一下我提到的这一点吗。

export const productreducer=(state=initialstate,{type,payload})=>{
switch(type)
case ActionTypes.SETPRODUCTS:
return{...state,...payload}; //here I have a doubt
default:
return state
}
};

Answer 1

所以｛…｝指的是扩展或展开可迭代元素，举个例子，你不能直接在redux存储中更改状态，因此你需要制作一个副本，并将新的有效负载附加到状态中，然后返回状态。

state＝｛x:1，y:2｝有效载荷＝｛y:5，z:6｝

｛…状态，…有效载荷｝//｛x:1，y:5，z:6｝

这将把旧状态更新为新状态。

Answer 2

通常，假设您有

const a = { foo: 1, bar: 2 }

那么以下两个是等价的：

return { foo: a.foo, bar: b.bar }

和

return { ...a }

所以本质上，...将所有元素从旧对象复制到新对象中。

也就是说，现代的Redux不会这么做。现代Redux也不做切换。。减速器、ACTION_TYPES或连接。你可能一直在遵循一个非常过时的教程。

我真的建议你遵循官方的Redux Essentials教程，该教程将从一开始就教你现代Redux——它可以更安全地防止意外错误，而且只需四分之一的代码。

Answer 3

这是Spread语法。在您的情况下，它从对象中获取所有键：值对，并将它们组合到一个新对象中。希望有了摘录，会更清晰

const state = {a: 1, b: 2}
const payload = {c: 3, d: 4}
const result = {...state, ...payload}
console.log(result)