How to use the nprogress.start function in nprogress

router.beforeEach(async (to: Route, _: Route, next: any) => {
  // 路由
  const loadI18n = (isFirst: Boolean = false) => {
    // 加载语言
    import(`@/pages${to.path}/local.ts`).then(LOCAL => {
        bindLang(LOCAL.default)
        isFirst ? next({ ...to, replace: true }) : next();
    }).catch(() => {
        console.warn('找不到 多语言文件');
        isFirst ? next({ ...to, replace: true }) : next();
    })
  }
  NProgress.start();
  if (UserModule.token) {
    // Check roles
    if (UserModule.roles.length === 0) {
      try {
        await UserModule.GetUserInfo();
        RoutesModule.PageList(pageList);
        RoutesModule.GenerateRoutes(UserModule.menus);
        router.addRoutes(RoutesModule.dynamicRoutes);
        loadI18n(UserModule.roles.length > 0);
      } catch (err) {
        Message.error(err || "Has Error");
        location.href = "/login.html";
        // next(`/login?redirect=${to.path}`);
        NProgress.done();
      }
    } else {

onToken = async (res, createOrder) => {
    NProgress.start();
    const order = await createOrder({
      variables: {
        token: res.id,
      },
    });
    console.log(order);
    // Route them to that order page
    const { id } = order.data.createOrder;
    Router.push({
      pathname: `/order`,
      query: { id },
    });
  };
  render() {

router.beforeEach((to, from, next) => {
  // 进度条
  NProgress.start()
  // 关闭搜索面板
  store.commit('d2admin/search/set', false)
  // 验证当前路由所有的匹配中是否需要有登录验证的
  if (to.matched.some(r => r.meta.requiresAuth)) {
    // 这里暂时将cookie里是否存有token作为验证是否登录的条件
    // 请根据自身业务需要修改
    const token = util.cookies.get('AoomsToken')
    if (token && token !== 'undefined') {
      next()
    } else {
      // 将当前预计打开的页面完整地址临时存储 登录后继续跳转
      // 这个 cookie(redirect) 会在登录后自动删除
      //util.cookies.set('redirect', to.fullPath)
      // 没有登录的时候跳转到登录界面
      next({
        name: 'login'

Template.body.rendered = function () {
	/* Third-Party Progress bar: NProgress */
	NProgress.configure({trickleRate: 0.01, trickleSpeed: 1400})
	NProgress.start()

	// Jquery tooltip for reset button
	$('[data-toggle="tooltip"]').tooltip()

	// Receive files from Electron
	// Desktop.on('desktop', 'selected-file', (event, data) => {
	// 	console.log('Selected File Dialog Data:', event, data)
	// 	if (data.length === 1) {
	// 		// Single folder to open
	// 		$('#directory').val(data[0])
	// 		setPath()
	// 	}
	// })
}

router.beforeEach((to, from, next) => {
  NProgress.start() // 开启Progress
  if (getToken()) { // 判断是否有token
    if (to.path === '/login') {
      next({ path: '/' })
      NProgress.done() // router在hash模式下 手动改变hash 重定向回来 不会触发afterEach 暂时hack方案 ps：history模式下无问题，可删除该行！
    } else {
      if (store.getters.name.length === 0) { // 判断当前用户是否已拉取完user_info信息
        store.dispatch('GetUserInfo').then(res => { // 拉取user_info
          let token=JSON.parse(res.data.data).token
          store.dispatch('generatorRoutes',token).then(() => { // 生成可访问的路由表
            router.addRoutes(store.getters.addRouters) // 动态添加可访问路由表
            next({ ...to }) // hack方法 确保addRoutes已完成
          }) 
        }).catch(() => {
          store.dispatch('FedLogOut').then(() => {
            Message.error('验证失败,请重新登录')
            next({ path: '/login' })

router.beforeEach((to,from,next) => {
    NProgress.start(); //开启Progress
    if(store.getters.status) {
        next
    } else {
        if(whiteList.indexOf(to.path) !== -1){  //在登录白名单，直接进入
            //alert("test")
            next();
        } else {
            store.dispatch('GetUserInfo').then(res => {
                //拉取user_info,并测试用户是否登录
                const roles = res.data.roles
                store.dispatch('GenerateRoutes',roles).then(() => {
                    console.log(store.getters.addRouters)
                    router.addRoutes(store.getters.addRouters) //动态添加可访问路由表
                    console.log(router)
                    next()
                    //next({ ...to })

import Nprogress from 'nprogress'
import * as util from './util'
import header from './header'
import Bus from './bus'
import {eachView, navigateBack, navigateTo, currentView} from './viewManage'
import {onBack, lifeSycleEvent, toAppService} from './service'
import * as command from './command'
import tabbar from './tabbar'
import * as nativeMethods from './native'
header.init();
tabbar.init();

Nprogress.start()


function sdk(data) {
  let msg = data.msg
  if (msg) {
    let sdkName = msg.sdkName
    if (sdkName == 'showPickerView') {
      command.showPickerView(data, msg.args)
    } else if (sdkName == 'showDatePickerView') {
      command.showDatePickerView(data, msg.args)
    } else if (sdkName == 'onKeyboardComplete') {
      showConsole(msg.sdkName, 'REGISTER_SDK')
    } else if (sdkName == 'getPublicLibVersion'
      || sdkName == 'onKeyboardConfirm'
      || sdkName == 'disableScrollBounce'
      || sdkName == 'onTextAreaHeightChange'

Router.onRouteChangeStart = () => {
  NProgress.start();
};
Router.onRouteChangeComplete = () => {

const App = ({ children, dispatch, app, loading, location }) => {
    const { user, siderFold, darkTheme, isNavbar, menuPopoverVisible, navOpenKeys, menu, permissions } = app
    let { pathname } = location
    pathname = pathname.startsWith('/') ? pathname : `/${pathname}`
    const { iconFontJS, iconFontCSS, logo } = config
    const current = menu.filter(item => pathToRegexp(item.route || '').exec(pathname))
    const hasPermission = current.length ? permissions.visit.includes(current[0].id) : false
    const href = window.location.href

    if (lastHref !== href) {
        NProgress.start()
        if (!loading.global) {
            NProgress.done()
            lastHref = href
        }
    }

    const headerProps = {
        menu,
        user,
        location,
        siderFold,
        isNavbar,
        menuPopoverVisible,
        navOpenKeys,
        switchMenuPopover () {
            dispatch({ type: 'app/switchMenuPopver' })

Router.onRouteChangeStart = () => {
  NProgress.start();
};
Router.onRouteChangeComplete = () => NProgress.done();