简述如何Redux 中的异步请求 ？
在 Redux 中，处理异步操作通常需要使用到中间件（middleware），比如 redux-thunk 或者 redux-saga。这些中间件可以让我们在 action creator 中返回一个函数或者 Promise，而不仅仅是一个纯对象。
以下是使用 redux-thunk 处理异步请求的示例：
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import axios from 'axios';
// 创建一个 Redux store，并使用 redux-thunk 中间件
const store = createStore(
rootReducer,
applyMiddleware(thunk)
);
// action types
const FETCH_DATA_REQUEST = 'FETCH_DATA_REQUEST';
const FETCH_DATA_SUCCESS = 'FETCH_DATA_SUCCESS';
const FETCH_DATA_FAILURE = 'FETCH_DATA_FAILURE';
// action creators
const fetchDataRequest = () => ({ type: FETCH_DATA_REQUEST });
const fetchDataSuccess = data => ({ type: FETCH_DATA_SUCCESS, payload: data });
const fetchDataFailure = error => ({ type: FETCH_DATA_FAILURE, payload: error });
// 异步 action creator
const fetchData = () => {
return dispatch => {
dispatch(fetchDataRequest());
axios.get('https://api.example.com/data')
.then(response => {
dispatch(fetchDataSuccess(response.data));
})
.catch(error => {
dispatch(fetchDataFailure(error.message));
});
};
};
// 使用
store.dispatch(fetchData());
在上面的例子中，我们首先创建了一个 Redux store，并使用了 redux-thunk 中间件。接着，我们定义了三个 action types 和对应的 action creators。其中，fetchData 是一个异步 action creator，它返回一个函数。这个函数接收 dispatch 参数，然后使用 axios 发起一个异步 HTTP 请求。当请求开始时，我们 dispatch fetchDataRequest action 来更新 state。当请求成功时，我们 dispatch fetchDataSuccess action 并传入返回的数据。当请求失败时，我们 dispatch fetchDataFailure action 并传入错误信息。
最后，我们可以通过 store.dispatch(fetchData()) 来发起这个异步 action。