使用create-react-app脚手架构建React+Redux项目及Redux的使用

一. 使用create-react-app搭建项目目录

首先确保安装了nodejs，再安装脚手架工具create-react-app.
使用npm运行指令create-react-app project:

运行完成后项目目录如下：

二. 项目中Redux的使用

1.入口文件创建store

也可以注册中间件方便redux调测，下面为固定写法：

2.创建自己的组件结构

3.创建action

4.创建reducers

5.使用Redux：就是两方面(派发数据更改和使用数据更改)

派发数据更改即当store中的某个数据需要更新时，我们需要dispaych(action)将最新数据更新到顶层数据store中。

使用数据更改即使用store中的数据。

如此，Redux真的很简单。

三.说一说如何使用mockJson配置假数据

1.使用Servr.js替换projectnode_moduleswebpack-dev-serverlib中的Servr.js

2.新建与node_modules文件夹同级的config文件夹，在config中放置配置文件api.js：

3.新建与node_modules文件夹同级的mockJson文件夹，里面放置对应的假数据json文件

四.打包

最后npm 运行 npm run build对css,js,html文件进行打包，执行完成后，会自动生成一个build文件夹，里面放置的是打包后的css,html文件。

备注：本文只是具体讲解使用create-react-app构建react+redux项目以及redux的使用，而以上所贴的截图代码并不完整，只是展示关键信息，请谅解。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!