How to use the view-design.LoadingBar function in view-design

router.beforeEach((to, from, next) => {
    ViewUI.LoadingBar.start()

    setTimeout(() => utils.title(to.meta.title), 0)

    if (!getToken() && to.name !== 'login') {
        next({
            name: 'login',
        })
    } else if (getToken() && to.name === 'login') {
        next({
            name: 'dashboard',
        })
    }

    // 判断当前是否是锁定状态
    else if (isLock() && to.name !== 'locking') {
        next({

import Router from 'vue-router'
import ViewUI from 'view-design'
import {routers} from './router'
import {getToken, isLock} from '../utils/auth'

Vue.use(Router)

let router = new Router({
    // mode: 'history', 后端支持可开
    scrollBehavior: () => ({y: 0}),
    routes: routers,
})

export default router

ViewUI.LoadingBar.config({
    color: '#08fa34',
    //failedColor: '#f0ad4e',
    //height: 5
})

let ignoreRouter = ['404', '403', '500', 'locking', 'login', 'dashboard', 'profile_index', 'message_index']

router.beforeEach((to, from, next) => {
    ViewUI.LoadingBar.start()

    setTimeout(() => utils.title(to.meta.title), 0)

    if (!getToken() && to.name !== 'login') {
        next({
            name: 'login',
        })

router.afterEach((to, from, next) => {
    ViewUI.LoadingBar.finish();
    window.scrollTo(0, 0);
});

router.beforeEach((to, from, next) => {
    ViewUI.LoadingBar.start();
    Util.title(to.meta.title);
    next();
});