Javascript 在什么情况下，忽略useReducer中的spread操作符会导致错误？

在我看到的大多数

useReducer

示例中，spread操作符用于保留状态。然而，在我的所有实践中，忽略它从未导致任何问题。似乎减速机能够在不使用扩展运算符的情况下保持状态本身。检查以下示例：

const initialState = {
    color: 'black',
    bgColor: 'white'
}

const reducer = (state, action) => {
    switch (action.type) {
        case 'dawn':
            return {
                ...state,
                color: 'white',
                bgColor: 'purple'
            }
        case 'reset':
            return initialState
        default:
            return {
                state
            }
    }
}

const UseReducerColorSetter = () => {
    const [state, dispatch] = useReducer(reducer, initialState);
    const { color, bgColor } = state;
    return (
        <>
            <div style={{ color: `${color}`, backgroundColor: `${bgColor}` }} className='card'>
                Hello
            </div>
            <button onClick={() => dispatch({ type: 'dawn' })}>Dawn mode</button>
            <button onClick={() => dispatch({ type: 'reset' })}>Reset</button>
        </>
    )
}

const initialState={
颜色：'黑色'，
背景颜色：“白色”
}
const reducer=（状态、操作）=>{
开关（动作类型）{
案件‘黎明’：
返回{
……国家，
颜色：'白色'，
颜色：“紫色”
}
案例“重置”：
返回初始状态
违约：
返回{
状态
}
}
}
常量UseReducerColorSetter=（）=>{
const[state，dispatch]=useReducer（reducer，initialState）；
const{color，bgColor}=状态；
返回(
你好
调度（{type:'dawn'}}>dawn模式
分派（{type:'reset'}）}>reset
)
}

在本例中，删除

…state

不会导致任何问题、状态更改、控制台错误等

在这个问题中，我问：，忽略spread操作符导致

useState

出现问题，但是

useReducer

仍然没有问题

---

有人能给我举一些例子，说明忽略排列运算符会导致

useReducer

中出现问题吗？减速机能否保持状态？

在您的特定情况下，它不会影响或产生问题，因为您正在更改状态值（颜色和bgColor），如果您的情况仅更改颜色，例如，忽略扩展运算符将使状态没有bgColor值，如果您的应用程序希望始终使用bgColor，则这可能会导致问题

 case 'blue':
            return {
                color: 'blue',
            }

---

下面是一个运行的示例，显示如果不替换减速器中的所有对象属性，它们将丢失。将控制台记录的初始值与打印的结果进行比较

const initialState={
颜色：“黑色”，
背景颜色：“白色”
};
const reducer=（状态、操作）=>{
开关（动作类型）{
案件“曙光”：
返回{
bgColor：“紫色”//更新为仅返回一个属性以说明问题
};
案例“重置”：
返回初始状态；
违约：
返回{
状态
};
}
};
函数App（）{
const[state，dispatch]=React.useReducer（reducer，initialState）；
React.useffect（（）=>{
日志（“初始：”，状态）
调度（{type:“dawn”}）；
}, []);
返回{JSON.stringify（state）}；
}
ReactDOM.render（，document.getElementById（'root'））

我尝试了你的代码，但没有引起问题，文本颜色变为蓝色，重置工作正常。是的，只是反复检查，看起来它保持了旧属性不变