简述state 和 props 触发更新的生命周期分别有什么区别?

在React中,组件的更新可以由props或state的改变触发,但是这两者触发更新的生命周期方法有所不同。

当props改变时:

  1. getDerivedStateFromProps: 这是一个静态方法,当一个组件被创建和每次组件接收新的props时都会被调用。它应返回一个对象来更新state,如果返回则不更新任何内容。

  2. shouldComponentUpdate: 这个方法在组件接收新的props或state时被调用,返回一个布尔值决定React是否应该继续渲染。默认情况下,这个方法返回true。

  3. render: 这是一个必须的方法,它返回React元素,描述在屏幕上应该看到什么。

  4. getSnapshotBeforeUpdate: 这个方法在最新的render输出被提交给DOM之前运行,它使得组件可以在可能更改之前从DOM捕获一些信息。

  5. componentDidUpdate: 这个方法在更新发生后立即被调用。

当state改变时:

  1. shouldComponentUpdate: 这个方法在组件接收新的props或state时被调用,返回一个布尔值决定React是否应该继续渲染。默认情况下,这个方法返回true。

  2. render: 这是一个必须的方法,它返回React元素,描述在屏幕上应该看到什么。

  3. getSnapshotBeforeUpdate: 这个方法在最新的render输出被提交给DOM之前运行,它使得组件可以在可能更改之前从DOM捕获一些信息。

  4. componentDidUpdate: 这个方法在更新发生后立即被调用。

需要注意的是,getDerivedStateFromProps只有在props改变时才会被调用,而其他生命周期方法在props和state改变时都会被调用。

发表评论

后才能评论