router.js 2.9 KB

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