react有状态组件和无状态组件和生命周期函数

有状态组件

1.继承自Component类
2.可以使用state和props,并且都是使用this来调用this.state或this.props
3.拥有生命周期函数


无状态组件

1.就是一个函数
2.不能使用state,只会接收一个props形参,并且直接使用props参数不需要this
3.没有生命周期函数

生命周期函数

1.constructor
是es6中的构造函数,在该函数中可以调用当前组建的父级采用super(props),也可以设置state状态(或者说是初始化state的状态,当然react中也提供了一个方法getInitState方法用来初始化state)
说明:构造函数在对象生成前最先执行的方法就是这constructor方法,这个方法是自动执行的
2.componentWillMount
是组件即将要生成,可以修改状态
3.render
render函数执行的时候会将jsx语法挂载到dom上并创建虚拟DOM,并转化为浏览器可以识别的HTML文件,更新DOM
render函数在执行的时候会加载组件需要的子组件(但不是所有子组件都会加载)
4.componentDidMount
组件渲染完成,注意不要在这个生命周期函数里面更改组件的状态,不然会形成死循环


生命周期函数图

你可能感兴趣的:(react有状态组件和无状态组件和生命周期函数)