在 React 中,在二次封装的 axios 文件中引用 Redux 内容,可以通过以下步骤进行:

  1. 首先,确保你已经安装了 redux 和 react-redux 库。如果没有安装,可以使用以下命令安装:
npm install redux react-redux
  1. 在你的 axios 文件中,首先引入 redux 相关的内容:
import { useDispatch, useSelector } from 'react-redux';
  1. 在 axios 文件中,你可以使用useDispatchuseSelector来访问 Redux 的内容。例如,你可以使用useDispatch来触发 Redux 的 action,使用useSelector来获取 Redux 的 state。
import axios from 'axios';
import { useDispatch, useSelector } from 'react-redux';
import { fetchDataSuccess, fetchDataFailure } from './actions';

const CustomAxios = axios.create({
  // 这里是你的 axios 配置
});

CustomAxios.interceptors.response.use(
  (response) => {
    // 在请求成功时,使用 dispatch 触发 Redux 的 action 来更新 state
    const dispatch = useDispatch();
    dispatch(fetchDataSuccess(response.data));
    return response;
  },
  (error) => {
    // 在请求失败时,使用 dispatch 触发 Redux 的 action 来更新 state
    const dispatch = useDispatch();
    dispatch(fetchDataFailure(error));
    return Promise.reject(error);
  }
);

export default CustomAxios;

在上面的例子中,我们使用了 Redux 的useDispatch来触发fetchDataSuccessfetchDataFailure两个 action,并使用response.dataerror作为参数传递给 action。这样就可以在请求成功或失败时更新 Redux 的 state。

请注意,上述示例中的fetchDataSuccessfetchDataFailure是示例 action,你需要根据你的具体情况来替换它们。

这样,你就可以在二次封装的 axios 文件中引用 Redux 的内容了。

如何在二次封装的 axios 文件中引用 Redux

原文地址: https://www.cveoy.top/t/topic/qBTx 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录