Более глубокие уровни в редукторе перезаписываются - PullRequest
Новая
       7

Более глубокие уровни в редукторе перезаписываются

0 голосов
/ 30 мая 2018

У меня есть действие, которое выбирает некоторые данные из базы данных, используя несколько вызовов.Я пытаюсь создать правильную структуру для моих данных в редукторе, но более глубокие уровни объекта просто перезаписываются.

Реактивный вызов: 

_.forEach(['cat1', 'cat2', 'cat3', 'cat4'], (category) => {
    _.forEach(['day1', 'day2', 'day3'], (day) => {
        this.props.fetchSingleResult('2018', 'USA', day, category)
    })
})

Мое действие: 

export function fetchSingleResult(year, venue, day, category) {
// Get race result from a single category and day
const request = axios.get('/api/races/singleresult',
    {params: {
        year: year,
        venue: venue,
        day: day,
        category: category }
    });
return {
    type: FETCH_SINGLE_RESULT,
    payload: request,
    meta: {year: year, venue: venue, day: day, category: category}
};
}

Мой редуктор: 

case FETCH_SINGLE_RESULT:
        return {...state,
            [action.meta.year]: {...state[action.meta.year],
                [action.meta.venue]: {...state[action.meta.venue],
                    [action.meta.category]: {...state[action.meta.category],
                        [action.meta.day]: action.payload.data}}}};

Вывод этого объекта, который получается из этого, имеет только последний день и категорию в качестве ключей, т.е. 

{2018: {'USA': {'cat4': {'day3' : data}}}}

вместосо всеми категориями и днями вроде: 

{2018: 
    {'USA': 
        {'cat1': {'day1' : data, 'day2' : data, 'day3' : data}}, 
        {'cat2': {'day1' : data, 'day2' : data, 'day3' : data}}, 
        {'cat3': {'day1' : data, 'day2' : data, 'day3' : data}}, 
        {'cat4': {'day1' : data, 'day2' : data, 'day3' : data}}
     }
}

Есть идеи?

Есть много лет и много мест.

Ответы [ 2 ]

0 голосов
/ 30 мая 2018

То, как вы используете оператор распространения, приводит к тому, что попробуйте: 

case FETCH_SINGLE_RESULT: 
  const {year, venue, category, day} = action.meta;
  return _.merge(state, {[year]: {[venue]: {[category]: {[day]: action.payload.data}}}});
0 голосов
/ 30 мая 2018

Посмотрите, во-первых, этот уровень вложенности очень сложно поддерживать и уважать неизменность в реакции.Вы должны изменить структуру ответа конечной точки данных.

const getnewState = (state, action) => {
const initialStateValue = {...state }
const { year, venue, day, category } = action.meta
const data = action.payload
  if(initialStateValue[year]) {
    const currentYearValue = initialStateValue[year]
            if (currentYearValue[venue]) {
        const currentVenueValue = currentYearValue[venue]
        if(currentVenueValue[category]) {
          let currentCategoryValue = currentVenueValue[category]
            currentCategoryValue = {
          ...currentCategoryValue,
          [day]: data,
          }
        }
      }
  }
}

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

...