优化

Author: liaofeiyin

src/app/index.ts

@@ -0,0 +1,28 @@
+import Vue from "vue";
+import router from "./router";
+
+Vue.config.productionTip = false;
+
+export default {
+ start
+}
+
+function start() {
+ new Vue({
+ router,
+ render(h) {
+ return h('div', {
+ attrs: {
+ id: 'app'
+ }
+ }, [
+ h('keep-alive', [
+ this.$route.meta.keepAlive ? h('router-view') : ''
+ ]),
+ !this.$route.meta.keepAlive && h('router-view')
+ ])
+ }
+ }).$mount("#app");
+}
+
+

src/app/router.ts

@@ -0,0 +1,30 @@
+import Vue from "vue"
+import Router from "vue-router"
+import NotFoundComponent from '@/components/notFoundComponent.vue'
+
+Vue.use(Router);
+
+export default new Router({
+ mode: "history",
+ base: process.env.BASE_URL,
+ scrollBehavior,
+ routes: [{
+ path: '*',
+ component: NotFoundComponent
+ }]
+});
+
+function scrollBehavior(to:any, from:any,savedPosition:any) {
+ if (savedPosition) {
+ return savedPosition;
+ } else {
+ return {
+ x: 0,
+ y: 0
+ };
+ }
+}
+
+window.addEventListener('popstate', function(e) {
+ console.log(e)
+})

src/components/navigator.vue

@@ -21,6 +21,7 @@ export default vue.extend({
  },
  toAbout() {
  this.$router.push({path: '/about'})
+ //window.location.href ='../about'
  },
  }
 })

src/components/notFoundComponent.vue

@@ -4,7 +4,8 @@
 </template>
 
 <script>
-export default {
+import vue from 'vue'
+export default vue.extend( {
  data () {
  return {
  };
@@ -17,7 +18,7 @@ export default {
  mounted() {},
 
  methods: {}
-}
+})
 
 </script>
 <style lang='scss' scoped>

src/main.ts

@@ -0,0 +1,4 @@
+import app from '@/app/index'
+import './router/router'
+
+export default app.start()

src/router.ts

@@ -1,54 +1,41 @@
-import Vue from "vue"
-import Router from "vue-router"
-import {reloadIfNotFound} from './hooks'
+
+import router from "@/app/router"
+
 import NotFoundComponent from '@/components/notFoundComponent.vue'
 import Home from '@/views/home/home.vue'
 
-Vue.use(Router);
-
-const router = new Router({
- mode: "history",
- base: process.env.BASE_URL,
- scrollBehavior,
- routes: [
- { path: '*', component: NotFoundComponent },
- {
- path: "/home/home",
- name: "home",
- component: Home
+let routes = [
+ { path: '*', component: NotFoundComponent },
+ {
+ path: "/home/home",
+ name: "home",
+ component: Home,
+ meta: {
+ keepAlive: true,
+ },
+ },
+ {
+ path: "/home/abc",
+ name: "abc",
+ meta: {
+ keepAlive: true,
  },
- {
- path: "/home/abc",
-  name: "abc",
-  meta: {
-  keepAlive: true,
-  },
-  component: () =>
-  import(/* webpackChunkName: "home/abc" */ "@/views/home/abc.vue")
+ component: () =>
+ import(/* webpackChunkName: "home/abc" */ "@/views/home/abc.vue")
+ },
+ {
+ path: "/about",
+ name: "about",
+ meta: {
+ keepAlive: true,
  },
- {
- path: "/about",
- name: "about",
- meta: {
- keepAlive: true,
- },
- component: () =>
- import(/* webpackChunkName: "home/about" */ "@/views/about.vue")
- }
- ]
-});
+ component: () =>
+ import(/* webpackChunkName: "home/about" */ "@/views/about.vue")
+ }
+]
 
-router.beforeEach(reloadIfNotFound);
+router.addRoutes(routes)
+
+export default router
 
-export default router;
 
-function scrollBehavior(to:any, from:any,savedPosition:any) {
- if (savedPosition) {
- return savedPosition;
- } else {
- return {
- x: 0,
- y: 0
- };
- }
-}