摘要：
插件官网地址：https://hhyang.cn/v2/start/quickstart.html一.安装路由插件：npminstalluni-simple-router二.配置路由：1.编写路由代码：//src/router/index.jsimport{RouterMount,createRouter}from'uni-simple-router';constrouter=createRout
插件官网地址：https://hhyang.cn/v2/start/quickstart.html
一.安装路由插件：
npm install uni-simple-router
二.配置路由：
1.编写路由代码：
//src/router/index.js import {RouterMount,createRouter} from 'uni-simple-router'; const router =createRouter({ platform: process.env.VUE_APP_PLATFORM, routes: [...ROUTES] }); //全局路由前置守卫 router.beforeEach((to, from, next) =>{ next(); }); //全局路由后置守卫 router.afterEach((to, from) =>{ console.log('跳转结束') }) export { router, RouterMount }
2.配置main.js
//main.js import Vue from 'vue'import App from './App'import {router,RouterMount} from './router.js' //路径换成自己的 Vue.use(router) App.mpType = 'app' const app = newVue({ ...App }) //v1.3.5起 H5端 你应该去除原有的app.$mount();使用路由自带的渲染方式 //#ifdef H5 RouterMount(app,router,'#app') //#endif //#ifndef H5 app.$mount(); //为了兼容小程序及app端必须这样写才有效果 //#endif
三.使用路由：
假如你是通过name 来进行跳转。 this.$Router.push({ name: 'router1', params: { userId: '123'}}) //同样 等同于 this.$Router.push({ path: '/pages/router1/router1', query: { userId: '123' }})
四.路由守卫
可以在路由前卫中拦截路由，验证是否登录
//全局路由前置守卫 router.beforeEach((to, from, next) =>{ next(); }); //全局路由后置守卫 router.afterEach((to, from) =>{ console.log('跳转结束') })
五.坑位：
1.install not 。。。。
2.错误一：
Uncaught ReferenceError: ROUTES is not defined
3.错误三：
chunk-vendors.js:2071 Uncaught TypeError: Cannot read property 'replace' of null