uni-app 使用uni-simple-router进行路由守卫

// 1. 安装依赖
// uni-read-pages 适用于读取page.json 文件中的路由信息
npm i [email protected] uni-read-pages

// 2. 配置与初始化
// 2.1 根目录新建 vue.config.js 文件
const TransformPages = require('uni-read-pages')
const { webpack } = new TransformPages()
module.exports = {
  configureWebpack: {
    plugins: [
      new webpack.DefinePlugin({
	ROUTES: webpack.DefinePlugin.runtimeValue(() => {
	  const tfPages = new TransformPages({
	    includes: ['path', 'name', 'aliasPath', 'meta']
	  });
	  return JSON.stringify(tfPages.routes)
	}, true)
      })
    ]
  }
}

// 新建 router 配置文件
import { RouterMount, createRouter } from 'uni-simple-router';
import store from "@/store/index.js"

const router = createRouter({
  platform: process.env.VUE_APP_PLATFORM,
  routerErrorEach: ({ type, msg }) => {
    console.log(type, msg);
    switch (type) {
      // APP退出应用
      case 3:
        // #ifdef APP-PLUS
        router.$lockStatus = false;
        uni.showModal({
          title: '提示',
          content: '您确定要退出应用吗？',
          success: function (res) {
            if (res.confirm) {
              plus.runtime.quit();
            }
          }
        });
        // #endif
        break;
      case 2:
      case 0:
        router.$lockStatus = false;
        break;
      default:
        break;
    }
  },
  routes: [...ROUTES]   // ROUTES 这个名称是webpack 中配置的名称
});

//全局路由前置守卫
router.beforeEach((to, from, next) => {
  if (to.meta && to.meta.currentNav) {
    store.commit('updateCurrentNav', to.meta.currentNav);
  }
  next()
});

export { router, RouterMount }

// 3 main.js导入router.js并挂载
import {router,RouterMount} from './router/index';

// #ifdef H5
	RouterMount(app,router,'#app')
// #endif

// #ifndef H5
	app.$mount(); //为了兼容小程序及app端必须这样写才有效果
// #endif