November 10, 2022 8:28am

React Nested Inline Conditional

{props.user.id == props.currentUserId? null:
    <>
        {localFollowingDetails.includes(props.user.id)?
        <Button
            className=" bg-pink-400 text-white py-1 max-h-8 px-1 w-20 mt-1 ml-auto rounded-full no-highlights"
            onClick={followUnFollowUser}
        >
            Unfollow
        </Button>:
        <Button
            className="relative right-50 border-pink-400 border-2 ml-auto text-pink-400 py-0.5 w-20 max-h-8 mt-1 px-1 rounded-full no-highlights"
            onClick={followUnFollowUser}
        >
            Follow
        </Button>}
    </>
}

The <></> is important to allow the second inline constional

 

Leave a Reply

Your email address will not be published. Required fields are marked *