как сохранить данные объекта массива в хранилище

Question

Я пытаюсь сохранить несколько объектов в хранилище резервов в моем собственном приложении, но только один объект сохраняется, я новичок в резерве, я пробую множество решений, найденных в StackOverflow, но никто не работает: /

результат, который я имею в своем магазине:

"hives": {"hive_id": 12944, "hive_name": null} 

результат, который я хочу (или что-то подобное):

 "hives": [
1: {"hive_id": 123, "hive_name": "HelloHive"}, 
2: {"hive_id": 12944, "hive_name": null}] 

store:

const middleware = [thunk]
export const store = createStore(persistedReducer, applyMiddleware(...middleware));
export const persistor = persistStore(store);

редуктор :

const INIT_STATE = {
  hives: [],
}

const hiveReducer = (state = INIT_STATE, action) => {
  switch (action.type) {
case SET_HIVES:
      return {
        ...state,
        hives: action.payload,
      };
    [...]

создатель действия:

export const setHives = hives => {
  return {
    type: SET_HIVES,
    payload: hives,
  };
};

действие:

export const getHives = () => {
  return dispatch => {
    axios.get(GET_HIVE_URL, HEADER).then(res => {
      const status = res.data.status;
      const hives = res.data.hives;

      if (status == 'hiveFound') {
        for (let i = 0; i < hives.length; i++) {
          console.log(hives[i]);
          dispatch(setHives(hives[i]));
        }
      }
    });
  };
};

и мой API отправьте мне:

 "hives": [
        {
            "hive_id": 123,
            "hive_name": "HelloHive"
        },
        {
            "hive_id": 12944,
            "hive_name": null
        }
    ]

и консоль .log (hives [i]) return:

 LOG  {"hive_id": 123, "hive_name": "HelloHive"}
 LOG  {"hive_id": 12944, "hive_name": null}

спасибо

Answer 1

Прежде всего, в вашем редукторе вам не нужно использовать ...state оператор распространения, так как ульи, кажется, единственная переменная в вашем состоянии. И, во-вторых, вы перебираете каждый элемент улья, поэтому вы вводите их один за другим, перезаписывая предыдущий. Вы не добавляете его в массив. Вот как вам нужно изменить свое действие:

export const getHives = () => {
  return dispatch => {
    axios.get(GET_HIVE_URL, HEADER).then(res => {
      const status = res.data.status;
      const hives = res.data.hives;

      if (status == 'hiveFound') {
          dispatch(setHives(hives));
      }
    });
  };
};

Таким образом, он будет записывать весь массив в эту переменную в формате приставки.

Answer 2

В вашем редукторе попробуйте это:

case SET_HIVES:
      return {
        ...state,
        hives: [...state.hives,action.payload],
      };
    [...]

надеюсь, это поможет. не стесняйтесь сомнений