Question

我在项目中采用Redux进行状态控制，并在Axios中采用了实际使用的api。

但是我不知道何时应该通过Redux使用API调用来获取数据（实际上），何时应该在组件中直接进行api调用。

是否取决于是否需要在Redux中存储响应数据（以便在不同组件之间共享）？我可以知道任何最佳做法吗？

通过Redux调用API

export const fetchOptions = () => {
  return async (dispatch, getState) => {

    const request = await client.query({
      query: gqlQueries.getQuery,
    });
    const options = await request;


    dispatch({
      type: types.FETCH_DATA_END,
      options: options
    });
  }
}

直接在组件中进行API调用：

const axios = require("axios");

useEffect(() => {
    axios({
        url: 'http://localhost/graphql',
        method: 'post',
        data: {
        query: `
            query PostsForAuthor {
            author(id: 1) {
                firstName
                posts {
                    title
                    votes
                }
                }
            }
            `
        }
    }).then((result) => {
        console.log(result.data)
    });

}, []);

Answer 1

如果多个组件正在使用相同的数据，则redux会在此处发光。当您不希望显示任何过时的数据时，首选组件中的API调用，因此，每次组件装入时都调用api，并且数据始终与后端同步。可能还有其他一些条件，但这两个条件可以帮助我确定保持状态的位置。

何时使用Redux从api调用中获取数据

1 个答案: