Redux - добавление во вложенное состояние - PullRequest
0 голосов
/ 28 мая 2018

Я создаю приложение календаря.У меня есть состояние, установленное во вложенной структуре.Я хочу добавить один элемент в мою вложенную структуру.Я не уверен, как это сделать в Redux.

Вот мой 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: []}, 
            ]
        }
    ]
}

Если бы у меня был день, время, заголовок события, как я могу использовать Object.assign для редактирования текущей структуры и добавления одной строки (название) к соответствующему массиву событий?Я использую Object.assign все время, но не с такими вложенными значениями.

Буду признателен за любую помощь!

1 Ответ

0 голосов
/ 28 мая 2018
initialState.days.forEach(dayObject => {
  if(dayObject.day == 'Sunday') dayObject = {...dayObject,title: 'someTitle'}

  console.log(dayObject);    
})

Приведенный выше код будет циклически проходить через ваш текущий state, найти конкретный объект, в который вы хотите нажать заголовок, где в этом случае Sunday, взять все свойства объекта с днями: воскресенье и pushновые свойства title

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...