Redux-添加到嵌套状态

Question

I am building a calendar app. I have state set up in a nested structure. I want to add a single item to my nested structure. I am unsure how to do it in Redux.

Here is my initialState:

export const initialState = {
    modalActivated: false, 
    modalContent: null,
    days: [
        {
            day: 'Sunday', 
            slots: [
                {time: '12:00am', events: []}, {time: '1:00am', events: []}, {time: '2:00am', events: []}, {time: '3:00am', events: []}, 
                {time: '4:00am', events: []}, {time: '5:00am', events: []}, {time: '6:00am', events: []}, {time: '7:00am', events: []}, 
                {time: '8:00am', events: []}, {time: '9:00am', events: []}, {time: '10:00am', events: []}, {time: '11:00am', events: []}, 
                {time: '12:00pm', events: []}, {time: '1:00pm', events: []}, {time: '2:00pm', events: []}, {time: '3:00pm', events: []}, 
                {time: '4:00pm', events: []}, {time: '5:00pm', events: []}, {time: '6:00pm', events: []}, {time: '7:00pm', events: []}, 
                {time: '8:00pm', events: []}, {time: '9:00pm', events: []}, {time: '10:00pm', events: []}, {time: '11:00pm', events: []}, 
            ]
        },
        {
            day: 'Monday', 
            slots: [
                {time: '12:00am', events: []}, {time: '1:00am', events: []}, {time: '2:00am', events: []}, {time: '3:00am', events: []}, 
                {time: '4:00am', events: []}, {time: '5:00am', events: []}, {time: '6:00am', events: []}, {time: '7:00am', events: []}, 
                {time: '8:00am', events: []}, {time: '9:00am', events: []}, {time: '10:00am', events: []}, {time: '11:00am', events: []}, 
                {time: '12:00pm', events: []}, {time: '1:00pm', events: []}, {time: '2:00pm', events: []}, {time: '3:00pm', events: []}, 
                {time: '4:00pm', events: []}, {time: '5:00pm', events: []}, {time: '6:00pm', events: []}, {time: '7:00pm', events: []}, 
                {time: '8:00pm', events: []}, {time: '9:00pm', events: []}, {time: '10:00pm', events: []}, {time: '11:00pm', events: []}, 
            ]
        },
        {
            day: 'Tuesday', 
            slots: [
                {time: '12:00am', events: []}, {time: '1:00am', events: []}, {time: '2:00am', events: []}, {time: '3:00am', events: []}, 
                {time: '4:00am', events: []}, {time: '5:00am', events: []}, {time: '6:00am', events: []}, {time: '7:00am', events: []}, 
                {time: '8:00am', events: []}, {time: '9:00am', events: []}, {time: '10:00am', events: []}, {time: '11:00am', events: []}, 
                {time: '12:00pm', events: []}, {time: '1:00pm', events: []}, {time: '2:00pm', events: []}, {time: '3:00pm', events: []}, 
                {time: '4:00pm', events: []}, {time: '5:00pm', events: []}, {time: '6:00pm', events: []}, {time: '7:00pm', events: []}, 
                {time: '8:00pm', events: []}, {time: '9:00pm', events: []}, {time: '10:00pm', events: []}, {time: '11:00pm', events: []}, 
            ]
        },
        {
            day: 'Wednesday', 
            slots: [
                {time: '12:00am', events: []}, {time: '1:00am', events: []}, {time: '2:00am', events: []}, {time: '3:00am', events: []}, 
                {time: '4:00am', events: []}, {time: '5:00am', events: []}, {time: '6:00am', events: []}, {time: '7:00am', events: []}, 
                {time: '8:00am', events: []}, {time: '9:00am', events: []}, {time: '10:00am', events: []}, {time: '11:00am', events: []}, 
                {time: '12:00pm', events: []}, {time: '1:00pm', events: []}, {time: '2:00pm', events: []}, {time: '3:00pm', events: []}, 
                {time: '4:00pm', events: []}, {time: '5:00pm', events: []}, {time: '6:00pm', events: []}, {time: '7:00pm', events: []}, 
                {time: '8:00pm', events: []}, {time: '9:00pm', events: []}, {time: '10:00pm', events: []}, {time: '11:00pm', events: []}, 
            ]
        },
        {
            day: 'Thursday', 
            slots: [
                {time: '12:00am', events: []}, {time: '1:00am', events: []}, {time: '2:00am', events: []}, {time: '3:00am', events: []}, 
                {time: '4:00am', events: []}, {time: '5:00am', events: []}, {time: '6:00am', events: []}, {time: '7:00am', events: []}, 
                {time: '8:00am', events: []}, {time: '9:00am', events: []}, {time: '10:00am', events: []}, {time: '11:00am', events: []}, 
                {time: '12:00pm', events: []}, {time: '1:00pm', events: []}, {time: '2:00pm', events: []}, {time: '3:00pm', events: []}, 
                {time: '4:00pm', events: []}, {time: '5:00pm', events: []}, {time: '6:00pm', events: []}, {time: '7:00pm', events: []}, 
                {time: '8:00pm', events: []}, {time: '9:00pm', events: []}, {time: '10:00pm', events: []}, {time: '11:00pm', events: []}, 
            ]
        },
        {
            day: 'Friday', 
            slots: [
                {time: '12:00am', events: []}, {time: '1:00am', events: []}, {time: '2:00am', events: []}, {time: '3:00am', events: []}, 
                {time: '4:00am', events: []}, {time: '5:00am', events: []}, {time: '6:00am', events: []}, {time: '7:00am', events: []}, 
                {time: '8:00am', events: []}, {time: '9:00am', events: []}, {time: '10:00am', events: []}, {time: '11:00am', events: []}, 
                {time: '12:00pm', events: []}, {time: '1:00pm', events: []}, {time: '2:00pm', events: []}, {time: '3:00pm', events: []}, 
                {time: '4:00pm', events: []}, {time: '5:00pm', events: []}, {time: '6:00pm', events: []}, {time: '7:00pm', events: []}, 
                {time: '8:00pm', events: []}, {time: '9:00pm', events: []}, {time: '10:00pm', events: []}, {time: '11:00pm', events: []}, 
            ]
        },
        {
            day: 'Saturday', 
            slots: [
                {time: '12:00am', events: []}, {time: '1:00am', events: []}, {time: '2:00am', events: []}, {time: '3:00am', events: []}, 
                {time: '4:00am', events: []}, {time: '5:00am', events: []}, {time: '6:00am', events: []}, {time: '7:00am', events: []}, 
                {time: '8:00am', events: []}, {time: '9:00am', events: []}, {time: '10:00am', events: []}, {time: '11:00am', events: []}, 
                {time: '12:00pm', events: []}, {time: '1:00pm', events: []}, {time: '2:00pm', events: []}, {time: '3:00pm', events: []}, 
                {time: '4:00pm', events: []}, {time: '5:00pm', events: []}, {time: '6:00pm', events: []}, {time: '7:00pm', events: []}, 
                {time: '8:00pm', events: []}, {time: '9:00pm', events: []}, {time: '10:00pm', events: []}, {time: '11:00pm', events: []}, 
            ]
        }
    ]
}

If I had a day, time, title of event, how could I use Object.assign to edit the current structure and add a single string (the title) to the appropriate events array? I use Object.assign all the time, but not with nested values like this.

Any help would be appreciated!

Answer 1

initialState.days.forEach(dayObject => {
  if(dayObject.day == 'Sunday') dayObject = {...dayObject,title: 'someTitle'}

  console.log(dayObject);    
})

The above code will loop thru your current state , find the particular object that you wish to push title into, where in this case is Sunday , take all properties of object with days: sunday and push a new properties title