DEV Community

Ahmed Khelifi
Ahmed Khelifi

Posted on

React rendering problem

Hello guys, I have a problem rendering a component in react
{ url && <Youtube url={url} }
the component displays fine when I have an URL prop, but when I don't have a URL, it renders a blank screen and I can't see any information in the console or "react developer tool"
anybody know the reason !?

Top comments (3)

Collapse
 
adrfoong profile image
Adrian Foong

Do you have an actual code snippet you can post? You seem to be missing the closing bracket for your Youtube component, but that might just be a typo.

The blank screen is probably correct since your code is essentially saying that if url exists, keep going and render <Youtube url={url} />. If url doesn't exist, it stops evaluating that expression.

Collapse
 
tulusda profile image
tulusda • Edited

Add logic inside Youtube component. If props is null or not an url return error or else

Collapse
 
rayvikram profile image
rayvikram

Instead of && try use ternary operator. Url? :

no url

.

Check if your URL is string or not. I mean try logging in Or something