Explain in simple terms Higher Order Component in React?

Question

React

Hello everyone, please explain in simple language Higher Order Components in React, how many manuals I have not looked at, I still don’t understand what is the point of using this zoo of classes and functions. In fact, we get almost the same output as with ordinary react components. I seem to be missing something in this area. Entire libraries are created with an emphasis on this, for example, all sorts of Recompose. I ask for the simplest possible explanation of how it works and what problem it solves.

Answer 1

First link in google: https://facebook.github.io/react/docs/higher-order...
In short, a higher-order component is a decorator that adds some extra logic to some (arbitrary) component. For example, you can write a function that takes a component and returns the same component, but with some additional mouse click handling logic. Such a function will be a higher-order component. Once written, it can be applied to any component, as well as combined with other higher-order components (read about function composition , there is nothing specific to React here).

Answer 2

replace the word component with the word function and you will understand everything

Answer 3

Why do you need a decorator? , this is a type of decorator pattern applied in react-e components