Как загрузить данные аксиоса в качестве исходного состояния редукции

Question

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

это код моего редуктора

import axios from "axios";


const getBookings = () => {
  return new Promise((resolve) => {
    axios.get('http://localhost:4000/bookings.json')
      .then(res => resolve(res.data))
  });
}


const getInitiatState = getBookings().then(
  function(data)
  {
    console.log(data)
    const initialState = {
      data: data, // ' ' or axios result
    };
    return initialState;
  }

)


function bookings(state = getInitiatState, action)
{
  switch(action.type)
  {
    default:

      return state

  }

}

export default bookings;

Answer 1

Как я уже говорил в комментариях: вы должны сделать его пустым массивом / объектом и позже "инициализировать" состояние с помощью соответствующих действий.Прямо сейчас, вместо создания массива, вы заполняете его обещанием.

Мой пример с использованием React с хуками и setTimeout (это будет работать так же с вашей выборкой): https://codesandbox.io/s/6wwy4xxwwr?fontsize=14

Вы также можете просто сделать это в своем «index.js», используя store.dispatch(action), например:

import store from './fileWithConstStore';

fetch()
.then(data => {
  store.dispatch({
    type: 'INIT_BOOKINGS',
    payload: data 
  })
});

, но это скорее быстрое, чем утвержденное решение.