概念:
它相当于Router一个过滤器,所有的路由都会首先去执行它。
用法:
- 在vue的main.js中加入router.beforEach(to,from,next)
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css';
// 引入vuex
import store from './store'
import { postRequest } from './utils/api';
import { putRequest } from './utils/api';
import { getRequest } from './utils/api';
import { deleteRequest } from './utils/api';
Vue.use(ElementUI);
// 使用插件的形式进行请求的导入
Vue.config.productionTip = false
Vue.prototype.postRequest=postRequest;
Vue.prototype.getRequest=getRequest;
Vue.prototype.putRequest=putRequest;
Vue.prototype.deleteRequest=deleteRequest;
// 路由守卫
router.beforeEach((to,from,next)=>{
// from 从当前的路径 to跳转到的路径 next();有这个方法才可以到to的路径 当前这个方法也可以自定义要跳转的路径 比如:next('/')跳转到根路径
// next(error) 导航会被终止,并且这个错误会被传到路由里面
console.log(to);
console.log(from);
next('/');
}
)
new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')