first commit

2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
--- a/历届学生/韩一伟/每天课程/2021-08-11/index.html
+++ b/历届学生/韩一伟/每天课程/2021-08-11/index.html
@@ -0,0 +1,94 @@
+<!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>
+        [v-cloak] {
+            display: none;
+        }
+    </style>
+</head>
+
+<body>
+    <div class="app" v-cloak>
+        <h2>{{ hello }}</h2>
+        <ul>
+            <li v-for="(item,index) in list" @click="EnterInfo(item)">
+                {{ index }} | {{ item.title }}
+            </li>
+        </ul>
+
+        <img :src="src" alt="">
+
+        <ul>
+            <li v-for="(value,key) in obj">{{ key }} | {{ value }}</li>
+        </ul>
+
+        <div v-text="content"></div>
+        <div v-html="content"></div>
+
+        <div v-show="isShow" v-once>v-show 购物车有数据</div>
+
+        <div v-if="vip == 0">普通用户</div>
+        <div v-else-if="vip == 1">VIP1</div>
+        <div v-else-if="vip == 2">VIP2</div>
+        <div v-else-if="vip == 3">VIP3</div>
+        <div v-else>错误</div>
+
+        <div v-if="isShow">购物车有数据</div>
+        <div v-else>购物车没有数据</div>
+
+        <input type="text" placeholder="请输入用户名" v-model="userName" />
+        <input type="password" placeholder="请输入密码" v-model="userPwd" />
+        <button @click="Login">登 录</button>
+
+    </div>
+</body>
+<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
+<script>
+    // vue 指令（html属性）
+    // v-for 循环显示数据 key 必须要加
+    // v-bind 将变量绑定到标签的属性上 简写  : 
+    // v-on 绑定点击事件  v-on:事件类型="事件处理函数" 简写：@
+    // v-html
+    // v-show 是使用display:none 来控制元素显示隐藏
+    // v-if v-else  v-if-else 会把不符合条件的html直接删除
+    // v-model 只能用在输入框上，获取输入框的数值的
+    var vm = new Vue({
+        el: '.app',
+        data: {
+            userName: "",
+            userPwd: "",
+            vip: 1,
+            isShow: true,
+            hello: '你好这是测试',
+            src: 'https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png',
+            list: [
+                { id: 1, title: '新闻1' },
+                { id: 2, title: '新闻2' },
+                { id: 3, title: '新闻3' },
+            ],
+            content: "<h2>测试v-html</h2>",
+            obj: {
+                age: 18,
+                name: '刘兵'
+            }
+        },
+        methods: {
+            Login() {
+                console.log(this.userName);
+                console.log(this.userPwd);
+            },
+            EnterInfo(item) {
+                console.log(item);
+            }
+        }
+    })
+
+</script>
+
+</html>