一, 脚手架搭建 react 结构目录:
,NPM install -g create-react-App 全局安装 react 脚手架
,create-react-App react-demo 创建 react-demo 项目
,cd react-demo 进入到项目文件夹
,NPM start 启动本地项目
二, Styled-Components 与 Reset.CSS 的结合使用.
Styled-Components 解决 CSS 样式表不能私有的问题, Reset.CSS 重置不同浏览器标签默认设置
三, React-Redux 进行应用数据的管理
有些组件的数据, 你认为是只有该组件要用, 但是随着项目不断扩展, 说不定其他组件也要用, 这时候既然用了 React-Redux 管理数据, 就是要将所有的数据都交给其管理
React-Redux 和 Redux 这两个包都是结合使用的, React-Redux 有个 Provider 核心组件, 这点注意
四, combineReducers 完成对数据的拆分管理
项目越大, reducer.JS 代码越多, 所以构建项目时候就先要进行拆分处理
五, actionCreators 与 constants 的拆分
action 对象的创建, acitonType 的常量都要单独写在一个文件中进行管理
六, 使用 Immutable.JS 来管理 store 中的数据
Immutable 对象数据修改, 每次都会自动创建出一个新的 Immutable 对象, 用 Immutable 来解决 store 中的 state 误被修改的问题.
七, redux-immutable 统一数据格式
在第四步中, 用 combineReducers 对拆分的 reducer 合并到总的 reducer 中, 此时 reducer 返回的 state 还不是 immutate 对象, 会造成数据格式不统一, 将 combineReducers 原本由
redux 包引入, 改为由 redux-immutable 引入即可.
来源: http://www.bubuko.com/infodetail-3345988.html