前提:DvaJS快速上手(1)
相关知识点:Redux,React,ES6(ES6看扩展运算符和箭头函数)
相关链接:阮一峰redux教程,react小书,阮一峰ES6教程
React的核心思想就是组件化思想,页面会被切分成一些独立的、可复用的组件
一、props和state
1、props
理解为从外部传入组件内部的数据。由于React是单向数据流,所以props
基本上也就是从父级组件向子组件传递的数据。并且props是只能读取的
2、一个组件的显示形态可以由数据状态和外部参数所决定,外部参数也就是props
,而数据状态就是state
3、上面两点是术语总结,react的思想是把页面分割成一个一个的组件,比如我可以把上面两个点的文字做成一个组件(可以理解为将上面两句话放进剪贴板),如果在本篇文章的另一个地方需要再用上这两个点的话,我就不用在把上面两个点再手动打一遍,直接将组件拿出来用就行了(可以理解为粘贴),用面向对象的思想来说的话就是对组件进行封装,将页面封装成一个个组件,实现可复用,只不过这种封装是对HTML进行封装。
理解完组件的思想,state就是一个组件的内部状态,说人话就是组件内部的一组变量,不同的组件之间有着各自的state(变量),那么如果我想要让两个组件之间的state有交流,就需要用到props,如下,简单说state就是封装到组件里的变量,props的作用差不多就是全局变量,同级组件里的变量想要跟另一个组件的变量有交流,就得通过全局变量props,不同的组件可以引用同一个props包,以此实现组件的交流。