如何在redux操作中同步提取方法

时间:2019-05-06 12:21:13

标签: reactjs redux

我想知道如何同步获取方法。我想防止在返回响应之前在组件中呈现数据。

这是我的fetch方法的还原动作:

    export const FETCH_DATA_START = 'FETCH_DATA_START'
    export const FETCH_DATA_SUCCESS = 'FETCH_DATA_SUCCESS'
    export const FETCH_DATA_FAILED = 'FETCH_DATA_FAILED'

    export const getData = () => {
        return (dispatch) => {
            dispatch({
                type: FETCH_DATA_START
            })
            fetch(baseUrl, {
                    credentials: "include",
                    method: "GET",
                    headers: {
                        'Accept': 'application/json',
                        'Content-Type': 'application/json'
                    },
                })
                .then(res => res.json())
                .then((res) => {
                    dispatch({
                        type: FETCH_DATA_SUCCESS,
                        payload: res
                    })
                })
                .catch((err) => {
                    console.log(err)
                    dispatch({
                        type: FETCH_DATA_FAILED,
                        payload: 'error'
                    })
                })
        }

}

1 个答案:

答案 0 :(得分:0)

在这种情况下,通常的做法是将isFetching之类的标志设置为true,然后根据该标志的状态在JSX中显示加载微调框。

然后,当您收到数据时,您将隐藏此微调器并显示数据。