一. 使用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替换project\node_modules\webpack-dev-server\lib中的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的使用,而以上所贴的截图代码并不完整,只是展示关键信息,请谅解。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。