nutui/sites/demo/router.js

import Vue from 'vue';
import VueRouter from 'vue-router';
import Conf from '../../src/config.json';
import vueg from 'vueg';
import 'vueg/css/transition-min.css';


const Index = () => import('./view/index.vue');
const DemoNav = () => import('./view/demonav.vue');

// import Index from './view/index.vue';
// import DemoNav from './view/demonav.vue';


Vue.use(VueRouter);

const routes = [
  {
    path: '*',
    redirect: '/index'
  },
  {
    name:'index',
    path: '/index',
    components: {
      main: Index,
      demonav: DemoNav,
    }
  },
];

//组件示例页面
Conf.packages.map(item => {
  if (item.showDemo === false) return;
  const pkgName =  item.name.toLowerCase();
  routes.push({
    path: '/' + item.name,
    components: {
      main: () => import('../../src/packages/' + pkgName + '/demo.vue'),
      demonav: DemoNav
    },
    name: item.name
  });
});

const router = new VueRouter({
  routes,
  scrollBehavior(to, from, savedPosition) {
    if (to.path == '/index') {
      return null;
    } else {
      return { x: 0, y: 0 }
    }
  }
});

const options = {
  duration: '0.2', //转场动画时长，默认为0.3，单位秒
  firstEntryDisable: true, //值为true时禁用首次进入应用时的渐现动画，默认为false
  firstEntryDuration: '.3', //首次进入应用时的渐现动画时长，默认为.6
  forwardAnim: 'fadeInRight', //前进动画，默认为fadeInRight
  backAnim: 'fadeInLeft', //后退动画，默认为fedeInLeft
  sameDepthDisable: false, //url深度相同时禁用动画，默认为false
  tabs: [], //默认为[]，'name'对应路由的name,以实现类似app中点击tab页面水平转场效果，如tabs[1]到tabs[0]，会使用backAnim动画，tabs[1]到tabs[2]，会使用forwardAnim动画
  tabsDisable: false, //值为true时，tabs间的转场没有动画，默认为false
  shadow: false, //值为false，转场时没有阴影的层次效果
  disable: false, //禁用转场动画，默认为false，嵌套路由默认为true
  nuxt: false //若使用后端渲染框架Nuxt，需要将此设为true，默认为false
};

Vue.use(vueg, router, options);

export default router;