创建Redux动作以用于不直接修改状态的API调用

在Redux中，可以使用Redux Thunk中间件来处理异步操作和API调用。使用Redux Thunk可以创建一个Redux动作，它可以在不直接修改状态的情况下进行API调用。

首先，需要安装redux-thunk依赖：

npm install redux-thunk

然后，在创建Redux存储时，将redux-thunk中间件应用于store：

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers';

const store = createStore(rootReducer, applyMiddleware(thunk));

接下来，可以创建一个Redux动作，用于进行API调用。在这个动作中，可以使用Redux Thunk提供的dispatch函数来触发其他的Redux动作。

import axios from 'axios';

export const fetchData = () => {
  return (dispatch) => {
    dispatch(fetchDataRequest());

    axios.get('https://api.example.com/data')
      .then(response => {
        const data = response.data;
        dispatch(fetchDataSuccess(data));
      })
      .catch(error => {
        dispatch(fetchDataFailure(error.message));
      });
  };
};

export const fetchDataRequest = () => {
  return {
    type: 'FETCH_DATA_REQUEST'
  };
};

export const fetchDataSuccess = (data) => {
  return {
    type: 'FETCH_DATA_SUCCESS',
    payload: data
  };
};

export const fetchDataFailure = (error) => {
  return {
    type: 'FETCH_DATA_FAILURE',
    payload: error
  };
};

在上面的代码中，fetchData是一个使用Redux Thunk的异步动作创建函数。它首先分发了一个fetchDataRequest动作，用于指示正在请求数据。然后使用axios库进行API调用，并根据请求结果分发不同的动作。

这样，就可以在Redux存储中使用fetchData动作来进行API调用，而不需要直接修改状态。