dai-vue-temp-m

添加404页面及网站地图

2022/4/26 16:32:27

更改列表

src/index.js 4(+1 -3)

src/page/404.vue 34(+34 -0)

src/routes.js 6(+5 -1)

详细信息

src/index.js 4(+1 -3)

diff --git a/src/index.js b/src/index.js
index a49b8ad..cffdb9f 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,8 +1,6 @@
 import * as api from './api.js';
 import routes from './routes.js';
-const models = {};
 export default {
     api,
-    routes,
-    models
+    routes
 };

src/page/404.vue 34(+34 -0)

diff --git a/src/page/404.vue b/src/page/404.vue
new file mode 100644
index 0000000..afaa80d
--- /dev/null
+++ b/src/page/404.vue
@@ -0,0 +1,34 @@
+<style scoped>
+.page-404 {
+    text-align: center; padding: 50px 20px 0 20px;color: #999; 
+}
+</style>
+<template>
+    <div class="page-404">
+        <div style="font-size:68px;">404</div>
+        <div style="font-size:18px;margin-top:20px;">糟糕,你的页面走丢了!</div>
+    </div>
+</template>
+<script>
+import { mapGetters } from 'vuex';
+export default {
+    mixins: [],
+    components: {},
+    props: [],
+    data: function () {
+        return {};
+    },
+    methods: {
+        async init() {}
+    },
+    watch: {},
+    created() {
+        this.init();
+    },
+    mounted() {},
+    //计算属性
+    computed: {
+        ...mapGetters(['vx_userInfo'])
+    }
+};
+</script>
\ No newline at end of file
diff --git a/src/page/routerMap.vue b/src/page/routerMap.vue
new file mode 100644
index 0000000..2802682
--- /dev/null
+++ b/src/page/routerMap.vue
@@ -0,0 +1,56 @@
+<style lang="less" scoped>
+.page-map {
+    color: #333; 
+}
+</style>
+<template>
+    <div class="page-map">
+        <route-item :route="item" v-for="(item,index) in list" :key="index"></route-item>
+    </div>
+</template>
+<script>
+import { mapGetters } from 'vuex';
+
+export default {
+    mixins: [],
+    components: {
+        'route-item': {
+            name: 'route-item',
+            props: {
+                route: {
+                    type: Object,
+                    default() {
+                        return {};
+                    }
+                },
+                base: {
+                    type: String,
+                    default: ''
+                }
+            },
+            template:
+                '<div style="padding-left:20px;"><div @click="$router.push({path:base + route.path})">{{route.meta && route.meta.pageName || route.path}}({{base + route.path}})</div><route-item :base="base + route.path" :route="item" v-for="(item,index) in route.children" :key="index"></route-item></div>'
+        }
+    },
+    props: [],
+    data: function () {
+        return {
+            list: []
+        };
+    },
+    methods: {
+        async init() {
+            this.list = this.$router.options.routes;
+        }
+    },
+    watch: {},
+    created() {
+        this.init();
+    },
+    mounted() {},
+    //计算属性
+    computed: {
+        ...mapGetters(['vx_userInfo'])
+    }
+};
+</script>
\ No newline at end of file

src/routes.js 6(+5 -1)

diff --git a/src/routes.js b/src/routes.js
index a37dd1a..b1134fa 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -1,2 +1,6 @@
-const routes = [{ path: '/', component: () => import('./page/home.vue'), meta: { pageName: '首页' } }];
+const routes = [
+    { path: '', component: () => import('./page/home.vue'), meta: { pageName: '首页' } },
+    { path: 'routerMap', component: () => import('./page/routerMap.vue'), meta: { pageName: '网站地图' } },
+    { path: '*', component: () => import('./page/404.vue'), meta: { pageName: '404' } },
+];
 export default routes;