Question

我想创建一个SPA（就像一个居中的布局，当我的用户登录google contact布局时，两者都来自vuetify页面），但是我对如何创建登录页面存有疑问。最好的方法。我的疑问是，创建一个路由器，然后在登录页面和主页之间切换，并在我的主页中更改另一个路由器以更改布局（谷歌联系人）或登录页面是一个组件，只有在我的用户登录后，我才创建组件（谷歌contatcs）和在路由器内部？

tks

Answer 1

您可以执行以下操作：

new Router({
    mode: 'hash', // https://router.vuejs.org/api/#mode
    routes: [
        {
            path: '/',
            name: 'Home',
            component: MyComponent,
            beforeEnter: (to, from, next) => {
                if(!isAuthenticated()) {
                    return next({name: 'login'});
                }
                return next();
            },
        },
        {
            path: '/login',
            name: 'Login',
            component: LoginComponent
        }
    ]
});

然后，您所需要做的就是以某种方式实现isAuthenticated()。您确保LoginComponent具有设置令牌或cookie的功能，以便保存某种登录状态。

看看https://router.vuejs.org/guide/#html

带有vuetify的登录页面

1 个答案: