Conditionally Display Login and Logout Buttons
In this tutorial, I'm going to show you how to display or hide a login or logout button based on whether a user is authenticated or not.
In our case, we're already logged in. If I show you the logout button in the navigator, you see that right below it, there's a login button, but there's this little crossed out eye that means there's also a login button, but it's currently hidden.
If I go on the logout and in my display settings, you see here that I'm using the Xano auth authentication and you see here that this variable is Authenticated is true. So we're saying the display here is true. Please display this log out button. Now, if we go on the login button, which we cannot see on the page right now, if we go to the display settings, you see that again we take that same variable isAuthenticated – and currently this is true – so if we take this out, the not out you will see now we're saying display the login button. So if I go here, you will see it here.
But we want the display to be false in the case of the login button when we are authenticated. So we can just say not authenticated and that'll work. Suddenly the display is false, and you can no longer see the login button.
So that's how you do conditional display based on the user's authentication status.
Watch video Conditionally Display Login and Logout Buttons online without registration, duration hours minute second in high quality. This video was added by user WeWeb 29 April 2022, don't forget to share it with your friends and acquaintances, it has been viewed on our site 2,204 once and liked it 12 people.