mardi 8 décembre 2020

Is returning early inside of a React component an anti-pattern, if so, what is it called?

I'm inclined to think that returning null inside of a React component like this,

const PayUser = ({ creditScore }) => {
    if (!creditScore) return null
    
    // render rest of component + logic
    ...

is an antipattern, and it's best to do this checking where the component is actually being called. So like

creditScore && <PayUser />

I know that "early returns" are sometimes good in complex functions, but to me it seems as if doing a return inside the component adds one extra concern, especially if the prop being passed is used only for this one purpose.

I'd like to know if this is actually an anti-pattern, and if so what is it called.

Aucun commentaire:

Enregistrer un commentaire