路由拦截插件uni-simple-router

hbuildx就去插件庫中找

vue-cli就使用npm下載

npm install uni-simple-router uni-read-pages

建立目錄router

modules目录下的index.js内容如下(这个文件主要作用是将所有路由整合成一个数组)

const filr = require.context('.', false, /\.js$/)
const modules = []

files.keys().forEach(key => {
	if (key === './index.js') return
	const item = files(key).default
	modules.push(...item)
})

export default modules

在modules目录下创建一个home.js文件,作用是根据不同的路由分类，添加更多模块

const home = [
	{	//path必須跟pages.json中的地址對應，
		path: '/pages/login/login',
		name 'login',
		meta: {
			title: '登錄'
		}
	}
]
export default home

router下的index.js配置如下

import modules from './modules'
import Vue from 'vue'
import Router from 'uni-simple-router'

Vue.use(Router)
const router = new Router({
	router: [...modules]// 路由表
})
//全局路由前置守衛
router.beforeEach((to, from, next) => {
	next()
})
//全局路由後置守衛
router.afterEach((to, from) => {

})

export router

在main.js中

import router from './router'
import { RouterMount } from 'uni-simple-router'

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

#ifdef H5
app.$mount()
#endif