it's a plugin of Vue-router that will allow you to handle middlewares
vue-road is a dependency-free, lightweight plugin Vue-router that can be overwritten by yourself.
npm install vue-road1/ First create an instance of the road bypassing callback function, inside of callback ,call the route method, route method accepts two parameters, an array of the routes as a first parameter and middlewares as a second parameter
/route
import road from "vue-road";
export default new road(function () {
this.route([
{ path: '*', redirect: '/' },
{ path: '/404', component: () => import('./views/error/404.vue') }
], "init")
this.route([
{ path: '/admin', component: () => import('./views/dashboard.vue')}
], ["auth"])
this.route([
{ path: '/mail', component: () => import('./views/mail.vue') }
],
#order is important
"auth,mail" #or ["auth","mail"]
)
},
#You can update routes as you want them to be provided
callback(routes){ })
2/ Assign all routes of your app in Vue router constructor by calling constant method then Call middleware method bypassing an object contains Vue Router instance as router and object of middlewares
/router
import Vue from "vue";
import Router from "vue-router";
import route from "./route"
Vue.use(Router);
const opts = {
routes: route.get(),
}
const router=new Router(opts);
route.middleware({ router,
auth:{
before: function ({to,from}) {
return new Promise((resolve, reject) => {
if(isAuth)resolve()
reject("403")
})
}
}
})
export default router
| api | Description | parameter | return |
|---|---|---|---|
| constant | return routes (before treatments) by middlewares passed as the second param if the first param is false it only return routes. | Boolean,[Array,String] | Array |
| get | return routes (after treatments) by middlewares passed as the second param if the first param is false it only return routes. | Boolean,[Array,String] | Array |
| getMiddlewares | return all used middlewares | Array |
This project is licensed under MIT License