react把组件看成是一个状态机,通过state去操作状态机(ps:突然想起这样写过轮播图2333);
在开发中通过与用户的交互实现不同的状态,然后渲染UI,让用户界面和数据保持一致;
在react中,只需更新组价的state,然后根据新的state重新渲染用户界面(不操作DOM)。只要state发生了改变,就会创建一个新的DOM树,和旧的DOM树进行对比,把有差异的地方更新掉,最终渲染到界面上。
class创建有state属性的组件
界面中可见state
在react中,不能直接改界面中的内容,要改state。因为改变state,会重新调用render方法。
this.setState状态改变引起界面改变
props和state:
props用来给组件传值,state在组件中定义状态,并在组件中用起来,通过状态的改变引起界面的改变。
props和state分开写
改变state
界面
props中的属性只能取用,也就是只读。props更多的是用在组件与组件之间的传值。
外界有传就用外界的
规范属性传进来的类型
固定写法
由于讲name设置为了number类型
浏览器虽渲染但报错
有时候需要某个属性必须传值
没有默认值
也不传值,但是设置了gender必须传
报错
但是如果有默认值,则不会报错。
1.在单组件中,props一般用于接收外部传入的数据,而state则用于记录组件内部数据,而且是需要经常改变的数据
2.state是组件内部的状态,不能够直接修改,必须要通过setState来改变值的状态,从而达到更新组件内部数据的作用
3.props更多是组件间传递数据的一种方式,props同样也可以传递state。由于react的数据是自上而下的,所以是从父组件向子组件进行传递,另外组件内部的this.props属性是只读的不可修改