十三）React项目实战记录：react-redux封装

jimson_zhu

已于 2024-02-02 13:43:00 修改

阅读量192

点赞数

分类专栏： Node.js与React.js项目实战文章标签： react.js 前端 javascript

于 2024-01-16 01:24:54 首次发布

本文链接：https://blog.csdn.net/jimson_zhu/article/details/135614348

版权

Node.js与React.js项目实战专栏收录该内容

49 篇文章 1 订阅 ¥199.90 ¥299.90

订阅专栏

本文记录了一次React项目中使用redux-thunk进行状态管理的实战过程，详细介绍了如何封装react-redux，包括创建对应目录、编写index.ts和reducer.ts文件，并处理可能出现的类型错误。

摘要由CSDN通过智能技术生成

可以先安装redux-thunk。

react-redux封装步骤如下。

1）新建对应目录和文件：

2）index.ts

import {legacy_createStore, combineReducers,compose,applyMiddleware} from "redux"
import reduxThunk from "redux-thunk"
import handleNum from "./NumStatus/reducer"
import handleArr from "./ArrStatus/reducer"
import handleXxxx from "./XxxxStatus/reducer"

// 组合各个模块的reducer
const reducers = combineReducers({
  handleNum,
  handleArr,
  handleXxxx
})


// 创建数据仓库
// window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__() 为了让浏览器正常使用redux-dev-tools插件
// const store = legacy_createStore(reducers,window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__());



// 判断有没有__REDUX_DEVTOOLS_EXTENSION_COMPOSE__这个模块
let comp

了解本专栏