Multi Auth Guard VueJS Vue-Route Vuex

Question

我有一個關於VueJS及其身份驗證形式的問題，我正在嘗試使用beforeEnter執行多重身份驗證保護，但是它不起作用，我留了一份我想如何做的工作，看看他們是否可以幫助我。

const isGlobal = (to, from, next) => {
    console.log('isGlobal called');
    if (store.getters.isAuthenticated && store.getters.getProfile.is_global) {
        next();
        return
    }

    next(false  )
}

const isAdmin = (to, from, next) => {
    console.log('isAdmin called');
    if (store.getters.isAuthenticated && store.getters.getProfile.is_admin) {
        next();
        return
    }

    next(false)
}
const isSupervisor = (to, from, next) => {
    console.log('isSupervisor called');
    if (store.getters.isAuthenticated && store.getters.getProfile.is_supervisor) {
        next();
        return
    }

    next(false)
}

const routes = [{
        path: '/',
        name: 'login',
        component: Login,
        beforeEnter: [isSupervisor || isGlobal || isAdmin],
    }
];

謝謝

Answer 1

問題是[isSupervisor || isGlobal || isAdmin] [isSupervisor || isGlobal || isAdmin] [isSupervisor || isGlobal || isAdmin]是一個等於[false]或[true]的數組，它必須是一個函數。 嘗試這樣的事情：

const isGlobal = store.getters.isAuthenticated && store.getters.getProfile.is_global

const isAdmin = store.getters.isAuthenticated && store.getters.getProfile.is_admin

const isSupervisor = store.getters.isAuthenticated && store.getters.getProfile.is_supervisor

const conditionalNext = function(condition) { 
    return (to, from, next) => {
        if (condition) {
            next();
            return
        }
        next(false)
    }
}

    const routes = [{
            path: '/',
            name: 'login',
            component: Login,
            beforeEnter: conditionalNext(isSupervisor || isGlobal || isAdmin)
        }
    ];