first commit

2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
--- a/历届学生/front-end-team/每天课程/2020-04-12/login.html
+++ b/历届学生/front-end-team/每天课程/2020-04-12/login.html
@@ -0,0 +1,189 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <style>
+        .router-link-active {
+            color: red;
+        }
+    </style>
+</head>
+
+<body>
+
+
+    <div id="app">
+        <h1>Hello App!</h1>
+        <p>
+            <router-link to="/index">首页</router-link>
+            <router-link to="/car">购物车</router-link>
+            <router-link to="/about">我的</router-link>
+        </p>
+        <router-view></router-view>
+    </div>
+</body>
+<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.5.3/vue.min.js"></script>
+<script src="https://cdn.bootcdn.net/ajax/libs/vue-router/3.1.4/vue-router.min.js"></script>
+<script>
+    const index = {
+        template: `
+        <ul>
+            <li @click="enterInfo(item.id)"
+              v-for="item,index in newsList">{{ item.title }}</li>
+        </ul>
+        `,
+        data() {
+            return {
+                newsList: [
+                    { id: 1, title: '新闻1', href: 'https://www.baidu.com/' },
+                    { id: 2, title: '新闻2', href: 'https://www.baidu.com/' },
+                    { id: 3, title: '新闻3', href: 'https://www.baidu.com/' },
+                ],
+            }
+        },
+        methods: {
+            enterInfo(id) {
+                this.$router.replace({
+                    name: 'info',
+                    query: {
+                        id: id
+                    }
+                })
+            }
+        }
+    }
+    const info = {
+        template: `<div>info {{ id }}</div>`,
+        data() {
+            return {
+                id: null
+            }
+        },
+        created() {
+            this.id = this.$route.query.id
+        }
+    }
+    const about = { template: '<div>about</div>' }
+    const car = { template: '<div>car</div>' }
+    const login = {
+        template: `<div>
+                <h2>登录</h2>
+                <button @click="Login">点我登录</button>
+            </div>`,
+        methods: {
+            Login() {
+                // 发送接口，后端返回token
+                var token = "sefwefewr345346456457657"
+                localStorage.setItem("token", token);
+                if (this.$route.query.hasOwnProperty("from")) {
+                    this.$router.replace({
+                        path: this.$route.query.from
+                    })
+                } else {
+                    this.$router.replace({
+                        path: "/index"
+                    })
+                }
+            }
+        }
+    }
+
+    const routes = [
+        {
+            path: '/',
+            redirect: "/index",
+            meta: {
+                isLogin: false
+            }
+        },
+        {
+            path: '/index',
+            component: index,
+            meta: {
+                isLogin: false
+            }
+        },
+        {
+            path: '/info',
+            name: 'info',
+            component: info,
+            meta: {
+                isLogin: false
+            }
+        },
+        {
+            path: '/about',
+            component: about,
+            meta: {
+                isLogin: true
+            }
+        },
+        {
+            path: '/car',
+            component: car,
+            meta: {
+                isLogin: true
+            }
+        },
+        {
+            path: '/login',
+            component: login,
+            meta: {
+                isLogin: false
+            },
+            beforeEnter: (to, from, next) => {
+                if (localStorage.getItem("token") == null) {
+                    next()
+                } else {
+                    router.back()
+                    next()
+                }
+            }
+        },
+    ]
+
+    const router = new VueRouter({
+        routes,
+        // linkActiveClass: 'active'
+    })
+
+    router.beforeEach((to, from, next) => {
+        console.log("to: ", to);
+        //    console.log("from: ", from);
+        // 表示需要登录
+        if (to.meta.isLogin) {
+
+            // 检查当前用户是否登录
+            // 已登录，放行
+            // 未登录，去登录
+
+            // 未登录，去登录
+            if (localStorage.getItem("token") == null) {
+                next({
+                    path: '/login',
+                    query: {
+                        from: to.fullPath
+                    }
+                })
+            } else {
+                next()
+            }
+
+            // 不需要登录    
+        } else {
+            next();
+        }
+
+    })
+
+    const app = new Vue({
+        el: '#app',
+        router
+    })
+</script>
+
+</html>