vue全局钩子函数,监控路由

有些页面需要登录后才能访问，可以进行判断，如果需要登录就重定向

{

　　path: '/hello',

　　name: 'Dcoument',

　　//不使用全局钩子函数监控路由的时候，可以对路由单个使用

　　beforeEnter (to,from,next) {

　　　　console.log('访问这个路由时会执行')

　　　　next()

　　}

　　meta: {

　　　　login: true,

　　　　title: '头部标题'

　　}

}

//路由进入之前

router.beforeEach((to,from,next) => {

　　console.log('进入路由是‘)

　　//next() //想进入路由必须调用一下这个方法

　　//next(false) //是不让进入路由

　　if (to.meta.login) {

　　　　next('/login')

　　} else {

　　　　next()

　　}

})

//路由进入之后

router.afterEach((to,from)) => {

　　if (to.meta.title) {

　　　　window.document.title = to.meta.title

　　} else {

　　　　window.document.title = '默认标题'

　　}

}

除了上面两种，还可以在页面中进行使用

export default {

　　data () {

　　　　test: '改变前'

　　},

　　beforeCreate () {

　　　　console.log('后执行')

　　},

　　beforeRouteEnter(to,from,next) {

　　　　console.log('先执行')

　　　　//在这里是访问不到this的，因为执行这个的时候，实例还没有被创建，可以用下面的方法

　　　　next((vm) => {

　　　　　　vm.test = '改变了'

　　　　})

　　　　

　　　　//next()

　　}，

　　beforeRouteUpdate (to,from,next) {

　　　　console.log(''更新)

　　　　next()

　　},

　　beforeRouteLeave (to,from,next) {//离开的时候

　　　　next()//是否允许离开

　　}

}