减速机被覆盖的更深层次

Question

我有一个操作，它使用多个调用从数据库中获取一些数据。我试图在还原器中为我的数据创建正确的结构，但是对象的更深层次只是被覆盖。

反应呼叫：

_.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}}
     }
}

有什么想法吗？

这里有很多年和很多场地。

Answer 1

使用spread运算符的方式导致了这种结果，请尝试：

case FETCH_SINGLE_RESULT: 
  const {year, venue, category, day} = action.meta;
  return _.merge(state, {[year]: {[venue]: {[category]: {[day]: action.payload.data}}}});

Answer 2

首先，这种层次的嵌套是很难维护和尊重的不变性的反应。您应该更改数据端点的响应结构。

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,
          }
        }
      }
  }
}

我刚刚在上面的代码中处理了一个流程，您需要照顾其他场景，比如，如果关键是它本身，而不是所有级别的。我继续为这一问题编写解决方案，但发现编写代码过于复杂。