Search code examples
javascriptreactjsiframeoperator-keywordloader

what is difference Three-way operator( ~ ? a: b). and Alternative operator. in my code

<>
   {isLoading || <Loader />}
   <iframe
     ref={iframeRef}
     title="title"
     src={src}
     onLoad={onIframeLoad}
   />
</>

I wrote the code like this at first. this code is in react and with
const [isLoading, setIsLoading] = useState(true) and In the onIframeLoad func With other works, i doing setIsLoading(false)

so i think loader component i cant see but i can see iframe with loader ???

so i changed the code {isLoading || } => {isLoading ? : ''} then it work well

but i dont understand what is difference code meaning

Solution

  • <Loader /> component will be visible when isLoading is false in your code.

    {isLoading || <Loader />} should be {isLoading && <Loader />}.

    <>
   {isLoading && <Loader />}
   <iframe
     ref={iframeRef}
     title="title"
     src={src}
     onLoad={onIframeLoad}
   />
</>