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/mixins.html
+++ b/历届学生/front-end-team/每天课程/2020-04-12/mixins.html
@@ -0,0 +1,84 @@
+<!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>Vue 基础学习</title>
+    <style>
+        .fade-enter-active,
+        .fade-leave-active {
+            transition: opacity 2s;
+        }
+
+        .fade-enter,
+        .fade-leave-to
+
+            {
+            opacity: 0;
+        }
+    </style>
+</head>
+
+<body>
+    <div class="app">
+        <h2>{{ test | sl }}</h2>
+
+        <transition name="fade">
+            <div v-if="isShow">true</div>
+        </transition>
+
+
+        <button @click="isShow = !isShow ">点我</button>
+    </div>
+</body>
+<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
+<script>
+
+
+    var a = {
+        data() {
+            return {
+                page: 1,
+                totalpage: 1
+            }
+        },
+        methods: {
+            more() {
+                console.log("加载更多");
+            }
+        }
+    }
+
+    // 混入
+    //  作用：用一种不会影响this指向的方式去封装代码
+    var vm = new Vue({
+        el: '.app',
+        mixins: [a],
+        data: {
+            test: '自定义指令学习',
+            isShow: true
+        },
+        created() {
+            console.log(this.more());
+        },
+        methods: {
+
+        },
+        computed: {
+
+        },
+        filters: {
+            sl(val) {
+                return val.substring(0, 3) + '..'
+            },
+        },
+        watch: {
+
+        }
+    })
+
+</script>
+
+</html>