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

正如我在评论中所说：您应该将其设置为空数组/对象，并在以后通过适当的操作“初始化”状态。现在，不用用数组来建立状态，而是用promise填充它。

我的示例使用带有钩子和setTimeout的React（这与您的提取相同）：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 
  })
});

但是这比批准的解决方案要快。

如何将axios数据加载为初始Redux状态

1 个答案: