Redux 更新状态数组中的项

Question

I am trying to update the building's name and image when the user clicks edit . I am dispatching the action correctly I think my logic with trying to copy the previous state and updating it with the new value is wrong because I am not seeing the value getting updated. It is just returning the previous state .Please can some help me out!

This is my code:

import MyBuilding from '../../models/MyBuilding'
import { CREATE_BUILDING, DELETE_BUILDING , UPDATE_BUILDING} from '../actions/building'

const initialState = {
    building: [],
}
const BuildingReducer = (state=initialState, action) =>{
    switch(action.type){
        case CREATE_BUILDING:
            const newBuilding = new MyBuilding(
                action.buildingData.id,
                action.buildingData.name,
                action.buildingData.image, 
            )
            return { ...state, building: state.building.concat(newBuilding)}

        case DELETE_BUILDING:
            const filteredItems = state.building.filter(cb => cb.id !== action.deleteCB)
            return {...state, building: filteredItems }

        case UPDATE_BUILDING:
            const updatedItems = state.building.map(cb => cb.id === action.updateItem.id ? 
                {...cb, 
                    name: action.updateItem.name,
                    image: action.updateItem.image} : cb
                )
            return {...state, 
                building: updatedItems }
        default: 
            return state
    }
}
export default BuildingReducer

Answer 1

Components connected with the store basically talks with the Redux state only. example

let state = {
building: [1,2,3]
}

console.log({ ...state, building: state.building.concat([4,5,6])}) // you will see all building here 
console.log(state) // but the actual state has not changed 

Assign the state to the changes you want and then return that state

case CREATE_BUILDING:
const newBuilding = new MyBuilding(
    action.buildingData.id,
    action.buildingData.name,
    action.buildingData.image,
)
state = { ...state, building: state.building.concat(newBuilding) } // do this
return state