Search code examples
reactjsconditional-rendering

React Multiple Condition Check(JSX)


I've been trying to do some conditional rendering based on the user that is logged in. Is there a way in React JSX to check if more than one condition is true? I know this syntax is wrong but is there a way I can do this with just JSX. I basically want to check if the post array is empty and if the loading variable is false.

{filteredPosts.length === 0 && loading === false ? "This user has no posts" :  <Posts loading={loading} fetchData={fetchData} posts={filteredPosts}/>}

Solution

  • try this

    {(filteredPosts.length === 0 && loading === false) ? "This user has no posts" :  <Posts loading={loading} fetchData={fetchData} posts={filteredPosts}/>}