DEV Community

Discussion on: React Anti-pattern: renderThing

Collapse
wintercounter profile image
Victor Vincent • Edited on

Not using classes (but functional components and hooks) will automatically save you from such solutions.

Collapse
dance2die profile image
Sung M. Kim • Edited on

Would you share more how "function components + hooks" can save one from having renderThings?

Collapse
wintercounter profile image
Victor Vincent

What you did there is basically extracting the return value of your renderThings function. The only way with FC to couple that value inside the component is to store it in a local variable which feels illegal enough for me to not to do it. This would also enforce a pattern like const renderThing = () => {} where I would immediately see that it is the component itself and I just have to rename it to Thing.