有人能帮我做什么吗..当前状态的扩散在这个代码中做了什么，通常它的定义是什么

Question

const userReducer = (currentState, action)=>{
switch (action.type){
case 'SET_CURRENT_USER':
return{
...currentState (???)
currentUser: action.payload
};
default: 
return currentState;
}

Answer 1

所以您想要更新状态。

但是，为了使react不会跳过重读程序，您需要返回一个新对象。如果要返回相同的对象，react将比较新对象和旧对象，注意它们是相同的浅对象，并将跳过渲染。

因此，要创建一个新对象，可以做几件事，但最重要的是扩散操作符：...。它解构一个对象并返回其中的所有值。这适用于数组、字符串和对象。

因此，通过将所有条目返回到一个新对象中，您可以创建一个浅层副本：相同的内容，但有新的对象引用。

所以这里发生的是：

1. 创建一个新对象return {}
2. 通过将currentState中的所有条目添加到新的状态对象{...currentState}中，可以用当前对象填充它。这会提供一个新对象，但所有条目都会复制到新对象中

3. 最后覆盖要覆盖的条目。将选择最后一个实例。它看起来是这样的：

   return{
   otherEntries,
   currentUser: currentState.currentUser, 
   currentUser: action.payload
   };
   

Answer 2

这是排列运算符。您可以使用它来创建复杂数据结构(如数组和对象(的副本(内存中的新位置(。

这里有一个例子：

const array1 = [1, 2, 3, 4, 5];
const object1 = {
a: 'a',
b: 'b'
};
console.log('array1');
console.log(array1);
console.log('object1');
console.log(object1);
// An exact copy of array1
const array2 = [...array1];
// Here we take the data from array1 and add more data to it.
const array3 = [...array1, 6, 7, 8, 9, 10];
console.log('array2');
console.log(array2);
console.log('array3');
console.log(array3);
// An exact copy of object1
const object2 = {...object1};
// Here we take the data from object1 and add more data to it.
const object3 = {...object1, c: 'c', d: 'd'};
console.log('object2');
console.log(object2);
console.log('object3');
console.log(object3);

在减速器的特定情况下，当您更改状态的特定属性时，您希望在不更改以前的属性的情况下进行更改。使用排列运算符可以排列状态已具有的每个属性，然后只更改所需的属性。

希望它能有所帮助！