I want to use Vue to display user information in the upper right corner of the navigation bar after a successful login.

Click to log in to enter the login interface, and after success, it will jump to the home page. At this time, I want to display user information and log out here. What should I do?

Mar.14,2021

use Vuex to store the login status and take it out where you need to display the login information.

but only in this way, you will encounter the problem that all these states will be lost after the page is refreshed.

my approach is to store the state of the VueX to sessionStorage, to ensure that the refresh page does not lose the state.


vuex cooperate with local storage


if you don't use vuex, mount global variables to store user information and then cooperate with local storage


this place has two manifestations, and it involves login status, and there are many scenarios to use, so it is recommended to use vuex read cache for management. You only need to read vuex to a computed to determine whether it has been logged in. If it is, it shows different components.

Menu