Merge pull request #97 from wanli-song/develop

fix(debugComponents's router)

demo/deploymentIndex.js

@@ -1,12 +1,16 @@
-import { Vue, router, i18n } from './init'
+import { Vue, i18n } from './init'
 import hljs from './hljs'
 import demoRouterView from './demoRouterView'
 import NaiveUI from '../lib/index'
 import '../lib/styles/index.css'
+import createRouter from './routes/router'
+import { routes } from './routes/routes'
 
 Vue.use(NaiveUI)
 NaiveUI.setHljs(hljs)
 
+const router = createRouter(Vue, routes)
+
 new Vue({
   ...demoRouterView,
   router,

demo/devIndex.js

@@ -1,12 +1,15 @@
 
-import { Vue, router, routes, childRoutes, i18n } from './init'
+import { Vue, i18n } from './init'
 import debugRouteMixin from './routes/debugRouteMixin'
 import hljs from './hljs'
 import demoRouterView from './demoRouterView'
 import NaiveUI from '../src/index'
 import '../styles/index.scss'
+import { routes, childRoutes } from './routes/routes'
+import createRouter from './routes/router'
 
 debugRouteMixin(routes, childRoutes)
+const router = createRouter(Vue, routes)
 
 Vue.use(NaiveUI)
 NaiveUI.setHljs(hljs)

demo/init.js

@@ -1,17 +1,16 @@
 import Vue from 'vue'
-import VueRouter from 'vue-router'
 import VueI18n from 'vue-i18n'
+import VueRouter from 'vue-router'
 import ComponentDemo from './utils/ComponentDemo'
 import ComponentDemos from './utils/ComponentDemos'
 import ComponentDocumentation from './utils/ComponentDocumentation'
 import DocumentationWrapper from './utils/DocumentationWrapper'
 import EditOnGithubButton from './utils/EditOnGithubButton'
 import EditOnGithubHeader from './utils/EditOnGithubHeader'
-import { routes, childRoutes } from './routes/routes'
 import './styles/demo.scss'
 
-Vue.use(VueRouter)
 Vue.use(VueI18n)
+Vue.use(VueRouter)
 
 const i18n = new VueI18n({
   locale: 'zh-CN'
@@ -24,23 +23,4 @@ Vue.component('ComponentDocumentation', ComponentDocumentation)
 Vue.component('EditOnGithubButton', EditOnGithubButton)
 Vue.component('EditOnGithubHeader', EditOnGithubHeader)
 
-const router = new VueRouter({
-  mode: 'history',
-  routes
-})
-
-router.beforeEach(function (to, from, next) {
-  Vue.prototype.$NLoadingBar.theme = to.params.theme
-  if (to.path !== from.path) {
-    Vue.prototype.$NLoadingBar.start()
-  }
-  next()
-})
-
-router.afterEach(function (to, from) {
-  if (to.path !== from.path) {
-    Vue.prototype.$NLoadingBar.finish()
-  }
-})
-
-export { Vue, router, routes, childRoutes, i18n }
+export { Vue, i18n }

demo/menuOptions.js

@@ -832,7 +832,7 @@ export default function (locale, instance) {
             },
             {
               name: 'PopoverDebug',
-              path: `/${instance.lang}/${instance.theme}/doc` + '/n-popover-debug'
+              path: '/n-popover-debug'
             },
             {
               name: 'RouterDebug',
@@ -856,11 +856,11 @@ export default function (locale, instance) {
             },
             {
               name: 'BackTopDebug',
-              path: `/${instance.lang}/${instance.theme}/doc` + '/n-back-top-debug'
+              path: '/n-back-top-debug'
             },
             {
               name: 'CascaderDebug',
-              path: `/${instance.lang}/${instance.theme}/doc` + '/n-cascader-debug'
+              path: '/n-cascader-debug'
             },
             {
               name: 'VerticalAlignDebug',

demo/routes/debugRouteMixin.js

@@ -14,18 +14,9 @@ import scrollbarDebug2 from '../debugComponents/scrollbarDebug2'
 import { withPrefix } from './utils'
 
 const rootDebugRoutes = [
-  {
-    path: '/n-popover-debug',
-    component: popoverDebug
-  },
-  {
-    path: '/n-back-top-debug',
-    component: backTopDebug
-  },
-  {
-    path: '/n-cascader-debug',
-    component: cascaderDebug
-  }
+  { path: '/n-popover-debug', component: popoverDebug },
+  { path: '/n-back-top-debug', component: backTopDebug },
+  { path: '/n-cascader-debug', component: cascaderDebug }
 ]
 
 const childDebugRoutes = [
@@ -41,6 +32,7 @@ const childDebugRoutes = [
 ]
 
 export default function debugRouteMixin (routes, childRoutes) {
-  routes.unshift(rootDebugRoutes)
-  childRoutes.unshift(withPrefix('/:lang/:theme/doc', childDebugRoutes))
+  childRoutes.unshift(...withPrefix('/:lang/:theme/doc', childDebugRoutes))
+  // routes[0].children[1].children = childRoutes
+  routes.unshift(...rootDebugRoutes)
 }

demo/routes/router.js

@@ -0,0 +1,22 @@
+import VueRouter from 'vue-router'
+
+export default function createRouter (Vue, routes) {
+  const router = new VueRouter({
+    mode: 'history',
+    routes
+  })
+  router.beforeEach(function (to, from, next) {
+    Vue.prototype.$NLoadingBar.theme = to.params.theme
+    if (to.path !== from.path) {
+      Vue.prototype.$NLoadingBar.start()
+    }
+    next()
+  })
+
+  router.afterEach(function (to, from) {
+    if (to.path !== from.path) {
+      Vue.prototype.$NLoadingBar.finish()
+    }
+  })
+  return router
+}

demo/routes/routes.js

@@ -78,7 +78,7 @@ import DocEntry from '../docEntry'
 
 import { withPrefix } from './utils'
 
-export const childRoutes = [
+export const childRoutes = withPrefix('/:lang/:theme/doc', [
   { path: '/intro', component: intro },
   { path: '/start', component: start },
   { path: '/dev-guildlines', component: devGuildlines },
@@ -149,7 +149,7 @@ export const childRoutes = [
   { path: '/n-typography', component: typography },
   { path: '/n-upload', component: upload },
   { path: '/n-table', component: table }
-]
+])
 
 export const routes = [
   {
@@ -164,7 +164,7 @@ export const routes = [
       {
         path: '/:lang/:theme/doc',
         component: DocEntry,
-        children: withPrefix('/:lang/:theme/doc', childRoutes)
+        children: childRoutes
       }
     ]
   },