为什么初始状态没有保留在 react-redux 中

Question

在“ADD_CONTACT”操作之后，新状态在 redux 中更新，但即使我使用扩展运算符添加初始状态，初始状态也不会恢复。

这是我的减速器：

const initalstate = {
  information :   [
        {
            key: 1,
            name: "firstname"
        }
    ]
}
export const productReducer = (state = initalstate, action)=>{
  
    switch (action.type) {
        case "ADD_CONTACT": 
        state = {...state , information :  action.payload,}
        console.log("state :", state)
        default:
           return state;
    }
}

这是我的调度函数：

const updatedata = [
    { id : "2", name : "secondname" },
    { id : "3", name : "thirdname"}
]

export const Footer = () => {
    const data = updatedata;
    const currentState = useSelector(state => state)
    const dispatch = useDispatch()
    const handSubmit = (data)=>{
    dispatch(
            { type : "ADD_CONTACT",
                payload :data } )
        console.log(currentState)}
    return (
        <div className="btn">
            <button onClick={()=>{handSubmit(data)}}>add</button>
        </div>
    )
}

id 2 & 3 被添加，但包含 id 1 的初始状态被从状态中删除。 请让我哪里出错了。 提前致谢，

Answer 1

您没有使用缩减状态的当前状态值：

export const productReducer = (state = initalstate, action)=>{
    switch (action.type) {
        case "ADD_CONTACT": 
          state = {
            ...state,
            information :  [...state.information, ...action.payload] // Combine them
          }
        default:
           return state;
    }
}