10 examples of 'vue router optional param' in JavaScript

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
}

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
}

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
}

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
}

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

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
}

12
function RouterConfig({ history, app }) {
13
  const routerData = getRouterData(app);
14
  const UserLayout = routerData['/user'].component;
15
  const BasicLayout = routerData['/'].component;
16
17
  return (
18
    <LocaleProvider locale={zhCN}>
19
      <ConnectedRouter history={history}>
20
        <Switch>
21
          <Route path="/user" component={UserLayout} />
22
          <AuthorizedRoute
23
            path="/"
24
            render={props => <BasicLayout {...props} />}
25
            authority={['admin', 'user']}
26
            redirectPath={getQueryPath('/user/login', {
27
              redirect: window.location.href,
28
            })}
29
          />
30
        </Switch>
31
      </ConnectedRouter>
32
    </LocaleProvider>
33
  );
34
}

1
export function routerConfig($componentLoaderProvider) {
2
  'ngInject';
3
  $componentLoaderProvider.setTemplateMapping(function(name) {
4
    return `app/${ name }/${ name }.html`;
5
  });
6
}

67
public route(url: string) {
68
  this.routed = true
69
70
  // TODO: check if relative?
71
  if (window.history && window.history.pushState) {
72
    history.pushState(null, '', url)
73
    this.updateLocationState()
74
    return true
75
  } else {
76
    location.href = url
77
    return false
78
  }
79
}

11
function makeRoute (name, needModel = false) {
12
  //正则匹配
13
  var url = name.replace(/\b(\w)|\s(\w)/g, first => first.toUpperCase());
14
  return {
15
    path: name,
16
    name: name,
17
    getComponent(nextState, cb){
18
      require.ensure([], require => {
19
        if (needModel && !app._models.some(val => (val.namespace===url)))
20
          app.model(require('./models/' + url))
21
22
        cb(null, require('./routes/' + url));
23
      });
24
    }
25
  }
26
}