一、有状态组件 和 无状态组件
1、有状态组件和无状态组件
有状态组件: 直接提供state的状态参数 ,可以跟新更新数据的状态,类组件就是一个有状态组件。
无状态组件: 没有提供state的状态参数,不可以跟新数据的状态, 函数组件就是无状态组件。
获取数据: 通过 this.state来获取数据
修改state的值: this.setstate({ data : value})
2.无状态组件中的state (函数组件中的state)
函数组件中使用 useState来设置state的参数状态:
const [状态值 , 设置状态的函数名称] = React.useState(state(数据)的状态值)
二、受控组件 和 非受控组件(表单处理)
1、受控组件 : 其值受到React控制的表单元素,当React元素的内容变化时state中的值也要发生变化。
如果想要解除被控制,可以为input
标签设置onChange
事件,输入的时候触发事件函数,在函数内部实现state
的更新,从而导致input
框的内容页发现改变。
2、非受控组件
1、可以通过 Ref 转发来让组件受控
过程: 1、首先通过React.createRef() 创建转发对象
2、在React元素中设置ref属性 ,然后件已经创建好的转发对象赋值给设置了ref属性的React对象。
3、通过 对象.current 获取该React元素的DOM对象