首页 > 代码库 > 关于props和state(React)

关于props和state(React)

  React的数据模型分为共有数据和私有数据,共有数据可以在组件间进行传递,私有数据为当前组件私有。共有数据在React中使用props对象来调用,它包含标签所有的属性名称和属性值,props对象有三个特性,单向流动性、显示传递性和只读性。单向流动性是指React的数据只能由父组件传递到子组件,而不能由子组件传递到父组件;显示传递性是指必须明确地在子组件中通过属性赋值,数据才可以传递到子组件;只读性是指props数据是只读的,数据修改后并未改变原始的数据模型,而是会新生成一份数据模型,并将新的数据模型加载到原始父元素,从而完成数据的传递和组件状态的更改。私有数据为组件私有,在React使用state对象来调用,state数据模型可以方便地进行更新操作,并且不会影响到其他组件。

  需要理解的是,props是一个父组件传递给子组件的数据流,这个数据流可以一直传递到子孙组件。而state代表的是一个组件内部自身的状态(可以是父组件、子孙组件)。改变一个组件自身状态,从语义上来说,就是这个组件内部已经发生变化,有可能需要对此组件以及组件所包含的子孙组件进行重渲染。而props是父组件传递的参数,可以被用于显示内容,或者用于此组件自身状态的设置(部分props可以用来设置组件的state),不仅仅是组件内部state改变才会导致重渲染,父组件传递的props发生变化,也会执行。

  既然两者的变化都有可能导致组件重渲染,所以只有理解props与state的意义,才能很好地决定到底什么时候用props或state。

关于props和state(React)