React——Redux在项目中的搭建

看此篇文章必须有Redux基础,这里不讲解基本用法,只是讲解如何在项目中搭建Redux 

如果没有基础请看这篇讲解:https://blog.csdn.net/qq_56989560/article/details/125409153?spm=1001.2014.3001.5501

安装:

yarn add redux
yarn add redux-thunk

1.先创建store文件夹下创建index.js文件

React——Redux在项目中的搭建_第1张图片

 2.创建Reducers文件

分模块管理,然后导入reducer.js进行分模块管理

React——Redux在项目中的搭建_第2张图片

React——Redux在项目中的搭建_第3张图片

 3.在入口文件中引入store文件,并从react-redux中导入Provider

React——Redux在项目中的搭建_第4张图片

 4.建立action文件夹

action主要是一个动作或行为的抽象,这里以发送axios异步请求为例

在action中 进行异步操作 

React——Redux在项目中的搭建_第5张图片

 在reducer中进行处理

React——Redux在项目中的搭建_第6张图片

 在组件中进行调用 useEffect()中调用

React——Redux在项目中的搭建_第7张图片

渲染数据

 

你可能感兴趣的:(React,react.js,前端,javascript)