Question

我已经习惯了redux with react，我现在已经完成了一些教程。我对如何从我的快速api（我从db获取数据）到redux商店获取数据感到困惑。

假设我的快速后端users.js中有一个文件，我连接到我的mysql数据库并返回数据库中的所有用户。所以在我的reducers文件夹中，我有一个index.js文件，看起来像这样

/reducers/index.js

// would i do a fetch(/users) here to populate users array with data from db?

const initialState = {
  users: []
};

const rootReducer = (state = initialState, action) => {
  switch(action.type) {
    case FETCH_USERS:
    return { ...state, users: [...state.users, action.payload] };
  }
}

或者正确的方法是让它返回空数组并在componentDidMount（fetch（/ users）...）中的组件中，并将state.users设置为我的结果来自该fetch？

我没有找到关于使用express api的react / redux的最佳实践的任何可靠的内容，所以任何答案以及清除我的困惑的链接都将非常感激

编辑**如果您正在阅读此内容并且在使用react / redux进行api调用方面存在类似的混淆，我发现最佳做法是在动作创建者中进行提取调用。

只需导入并调用组件中的动作创建者，然后将其传递给您想要的参数。在这个例子中，我将一个函数放在我的操作文件fetchUsers（）中，我在其中使用axios从服务器获取数据。

Answer 1

您应fetch中的componentDidMount()用户，然后在回复承诺时，您可以将用户分发到您的商店。

componentDidMount(){

fetch(url).then((response)=>{
  if(response.data){
    this.props.dispatch({
    type:"SET_USERS",
    payload: response.data
    })
  }
})

您应该connect()要存储您的组件以获取道具中的dispatch()。

将react-redux store连接到express + mysql后端

1 个答案: