我试图在用户从登录页面登录后“重新呈现”我的导航栏。我有一些导航链接会根据用户是否登录而显示。
现在，如果我能在localStorage上找到一个用户项，我将呈现这些用户项：
'

Navbar.vue
<script>
export default {
    data() {
        return {
            notLoggedInDropDown: false,
            loggedInDropDown: false,
            logged: localStorage.getItem('user') == null ? false : true,
            user : {} 
        }
    },
    methods: {
        closeSession() {
            localStorage.removeItem('user');
            localStorage.removeItem('token');
            this.logged = false;
            this.user = {};
        },
    },
    mounted() {
        var user = JSON.parse(localStorage.getItem('user'));
        this.user = user;
    },
}
</script>

第一个月

Login.vue
 methods: {
        async signIn(){
            try {
                const data = await login(this.username, this.password)
                localStorage.setItem('user', JSON.stringify(data.user))
                localStorage.setItem('token', data.token)
                this.$router.push('/')
            } catch (error) {
                this.error.status = true
                this.error.message = "Username or password failed."
            }
        }
    },

'
我试过使用mitt发送发射器，但navbar并不是登录页面的子组件。我也试过将记录的布尔值作为计算语句，但它仍然没有重新呈现。我知道它没有更新的原因是因为router.push方法不是React性的，但我不确定下一步该尝试什么。此外，我的应用目前没有使用Vuex。我可以很容易地集成到我的Vue应用程序中吗？欢迎任何帮助！