router.js 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. import Vue from 'vue';
  2. import VueRouter from 'vue-router';
  3. import { packages } from '@/config.json';
  4. import vueg from 'vueg';
  5. import frontCover from './index.vue';
  6. const Index = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'info' */'./info.vue');
  7. const Intro = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'intro' */'./page/intro.vue');
  8. const Start = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'start' */'./page/start.vue');
  9. const International = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'international' */'./page/international.vue');
  10. const Theme = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'theme' */'./page/theme.vue');
  11. const JoinUs = () => import(/* webpackPrefetch: true */ /* webpackChunkName: 'joinus' */'./page/joinus.vue');
  12. //const Update = () => import('./page/changelog.vue');
  13. Vue.use(VueRouter);
  14. const routes = [
  15. {
  16. path: '*',
  17. redirect: '/index'
  18. },
  19. {
  20. path: '/',
  21. redirect: '/index'
  22. },
  23. {
  24. path:'/index',
  25. name:'frontcover',
  26. component:frontCover
  27. },
  28. {
  29. path: '/intro',
  30. name:'intr',
  31. components: {
  32. default: Index,
  33. main: Intro,
  34. }
  35. },
  36. {
  37. path: '/international',
  38. name:'international',
  39. components: {
  40. default: Index,
  41. main: International,
  42. }
  43. },
  44. {
  45. path: '/start',
  46. name:'start',
  47. components: {
  48. default: Index,
  49. main: Start,
  50. }
  51. },
  52. {
  53. path: '/theme',
  54. name:'theme',
  55. components: {
  56. default: Index,
  57. main: Theme,
  58. }
  59. },
  60. {
  61. path: '/joinus',
  62. name: 'joinus',
  63. components: {
  64. default: Index,
  65. main: JoinUs,
  66. }
  67. }
  68. ];
  69. //组件md文件展示
  70. packages.map(item => {
  71. if (item.showDemo === false) return;
  72. const pkgName = item.name.toLowerCase();
  73. routes.push({
  74. path: '/' + item.name,
  75. components: {
  76. default: Index,
  77. main: () => import(
  78. /* webpackPrefetch: true */
  79. /* webpackChunkName: "doc-[request]" */`./view/${pkgName}.vue`)
  80. },
  81. name: item.name
  82. });
  83. });
  84. const router = new VueRouter({
  85. routes,
  86. scrollBehavior(to, from, savedPosition) {
  87. if (to.path == '/index') {
  88. return null;
  89. } else {
  90. return { x: 0, y: 0 }
  91. }
  92. }
  93. });
  94. const options = {
  95. duration: '0.3', //转场动画时长,默认为0.3,单位秒
  96. firstEntryDisable: false, //值为true时禁用首次进入应用时的渐现动画,默认为false
  97. firstEntryDuration: '.4', //首次进入应用时的渐现动画时长,默认为.6
  98. forwardAnim: 'fadeInRight', //前进动画,默认为fadeInRight
  99. backAnim: 'fadeInLeft', //后退动画,默认为fedeInLeft
  100. sameDepthDisable: false, //url深度相同时禁用动画,默认为false
  101. tabs: [], //默认为[],'name'对应路由的name,以实现类似app中点击tab页面水平转场效果,如tabs[1]到tabs[0] ,会使用backAnim动画,tabs[1]到tabs[2],会使用forwardAnim动画
  102. tabsDisable: false, //值为true时,tabs间的转场没有动画,默认为false
  103. shadow: false, //值为false,转场时没有阴影的层次效果
  104. disable: false, //禁用转场动画,默认为false,嵌套路由默认为true
  105. nuxt: false //若使用后端渲染框架Nuxt,需要将此设为true,默认为false
  106. };
  107. Vue.use(vueg, router, options);
  108. export default router;