10 examples of 'vue router beforeeach' in JavaScript

19
export function createRouter () {
20
    const router = new Router({
21
      base: __dirname,
22
      mode: 'history',
23
      scrollBehavior: () => ({ y: 0 }),
24
      routes: [
25
        route('/', 'Welcome'),
26
        route('/inspire', 'Inspire'),
27
        // Global redirect for 404
28
        { path: '*', redirect: '/' }
29
      ]
30
    })
31
32
    // Send a pageview to Google Analytics
33
    router.beforeEach((to, from, next) => {
34
        if (typeof ga !== 'undefined') {
35
            ga('set', 'page', to.path)
36
            ga('send', 'pageview')
37
        }
38
        next()
39
    })
40
41
    return router
42
}

83
initRouter (routerOptions) {
84
    assert(isObject(routerOptions), `lue.router: vue-router options should be a object.`);
85
    assert(!isDef(routerOptions['routes']), `lue.router: routes prop of vue-router options should be defined.`);
86
    assert(Array.isArray(routerOptions['routes']), `lue.router: routes prop of vue-router options should be a array.`);
87
88
    this.router = new VueRouter(routerOptions);
89
}

155
beforeEach(fn) {
156
	return lifeMothods.registerHook(this.lifeCycle.beforeHooks, fn);
157
}

11
export function createRouter() {
12
    const router = new VueRouter({
13
        mode: 'history',
14
        scrollBehavior: (to, from, savedPosition) => {
15
            if (savedPosition) {
16
                return savedPosition;
17
            } else {
18
                return { x: 0, y: 0 };
19
            }
20
        },
21
        routes: [
22
            { path: '/', component: List },
23
            { path: '/article/:id', component: Article, meta: { scrollToTop: true } },
24
            { path: '/page/:page', component: List },
25
            { path: '*', redirect: '/' },
26
        ],
27
    });
28
    if (typeof window !== 'undefined') {
29
        router.afterEach((to, from) => {
30
            if (document && !(/\/article\//g.test(to.path))) {
31
                document.querySelector('title').innerText = 'HJM\'s Blog';
32
            }
33
        });
34
    }
35
    return router;
36
}

156
afterEach(fn: Function): Function {
157
    return registerHook(this.afterHooks, fn)
158
}

18
export function initRouter(vm) {
19
  const config = vm.config
20
  const mode = config.routerMode || 'hash'
21
  let router
22
23
  if (mode === 'history' && supportsPushState) {
24
    router = new HTML5History(config)
25
  } else {
26
    router = new HashHistory(config)
27
  }
28
29
  vm.router = router
30
  updateRender(vm)
31
  lastRoute = vm.route
32
33
  router.onchange(_ => {
34
    updateRender(vm)
35
    vm._updateRender()
36
37
    if (lastRoute.path === vm.route.path) {
38
      vm.$resetEvents()
39
      return
40
    }
41
42
    vm.$fetch()
43
    lastRoute = vm.route
44
  })
45
}

37
export function createRouter () {
38
  return new Router(routerOptions)
39
}

25
export function createRouter(): Router {
26
    return new Router({
27
        mode: 'history',
28
        base: '/admin/',
29
        routes: [
30
            {   path: '',
31
                redirect: 'home'
32
            },
33
            {   path: '/home',
34
                name: 'home',
35
                meta: {requiresAuth: true},
36
                components: {
37
                    default: () => import('@app/ui/pages/Home').then(({ Home }) => Home),
38
                    toolbar: () => import('@app/ui/components/Toolbar').then(({ Toolbar }) => Toolbar),
39
                }
40
            },
41
            {   path: '/login',
42
                name: 'login',
43
                component: () => import('@app/ui/pages/Login').then(({ Login }) => Login)
44
            },
45
            {   path: '/repositories',
46
                name: 'repositories',
47
                meta: {requiresAuth: true},
48
                components: {
49
                    default: () => import('@app/ui/pages/Repositories').then(({ Repositories }) => Repositories),
50
                    toolbar: () => import('@app/ui/pages/Repositories/ListToolbar').then(({ Toolbar }) => Toolbar),
51
                },
52
            },
53
            {   path: "*",
54
                name: 'error404',
55
                components: {
56
                    default: () => import('@app/ui/components/Error404').then(({ Error404 }) => Error404),
57
                    toolbar: () => import('@app/ui/components/Toolbar').then(({ Toolbar }) => Toolbar),
58
                }
59
            }
60
        ]
61
    });
62
}

8
export function createRouter () {
9
  return new Router({
10
    mode: 'history',
11
    routes: [
12
      {
13
        path: '/',
14
        component: () => import('./components/Home.vue')
15
      },
16
      {
17
        path: '/users',
18
        component: () => import('./components/Users.vue')
19
      },
20
      {
21
        path: '*',
22
        redirect: '/'
23
      }
24
    ]
25
  })
26
}

279
addRoutes(routes: Array) {
280
    this.matcher.addRoutes(routes)
281
    if (this.history.current !== START) {
282
        this.history.transitionTo(this.history.getCurrentLocation())
283
    }
284
}