[Advanced React] Render Props application

[reboottime]

Render Props application

This article is a note of Render props - Advanced React course, Episode 4

Major Content

[reboottime]

The problem and Solution

Take the button component in previous lecture as an example, where the <Icon /> component may control its size using the font-size prop. For example:

<Icon fontSize="16" />

• This solution has two problems:

  • The previous logic for controlling the icon size fails silently
  
  • There is no way to update the icon color based on whether the button is currently being hovered over.

• The solution

[reboottime]

Why we still need it in these days?

• Configuration and flexibility
• lots of them in old codebase
• Sometimes still useful

• it can't help with performance