Prev Props in JavaScript

In React, props are used to pass data from one component to another. Sometimes, the component may need to compare the current set of props with the previous set of props. This is where prevProps comes in.

What are prevProps?

prevProps represents the previous set of props that were passed to the component. When the component re-renders due to a change in props, the current set of props will be different from the previous set. The previous set of props can be accessed in the componentDidUpdate lifecycle method, which is called after the component has updated.

componentDidUpdate(prevProps) {
  // Access previous props with prevProps
}

Why use prevProps?

Using prevProps can be useful when the component needs to perform a certain action only when a specific prop changes. For example, if a component is displaying a list of items and the items prop changes, the component may need to scroll back to the top of the list. However, if the selectedItem prop changes, the component may not need to scroll back to the top.

componentDidUpdate(prevProps) {
  if (this.props.items !== prevProps.items) {
    this.scrollToTop();
  }
}

Conclusion

In summary, prevProps can be used to access the previous set of props in React components. This can be useful for performing different actions based on which prop changed.