From 1fc2a1dc48743df8187bd487cb98ab86c8308f46 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=A9=AC=E9=9D=92=E9=9D=92?= <2910939733@qq.com>
Date: Tue, 29 Mar 2022 17:24:41 +0800
Subject: [PATCH] vue

---
 .../3.29 vue/demo01.html"                     | 74 +++++++++++++++++++
 1 file changed, 74 insertions(+)
 create mode 100644 "\351\251\254\351\235\222\351\235\222/3.29 vue/demo01.html"
diff --git "a/\351\251\254\351\235\222\351\235\222/3.29 vue/demo01.html" "b/\351\251\254\351\235\222\351\235\222/3.29 vue/demo01.html"
new file mode 100644
index 0000000..f60096c
--- /dev/null
+++ "b/\351\251\254\351\235\222\351\235\222/3.29 vue/demo01.html"	
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
+    <title>vue页面</title>
+    <style>
+        .aa{
+            /* width: 100%; */
+            width: 370px;
+            margin: 20% 40%;
+            background-color: white;
+            text-align: center;
+        }
+        .aa > div{
+            font-weight: bold;
+            font-size: 20px;
+        }
+    </style>
+
+</head>
+<body style="background-color:#f7f7f7;">
+    <div class="aa">
+        <div id="el2">
+            {{message}}<br>
+            <!-- v-bind--“将这个元素节点的 title attribute 和 Vue 实例的 message property 保持一致”。 -->
+            <span v-bind:title="message">
+                鼠标悬停几秒钟查看此处动态绑定的提示信息！
+              </span>
+        </div>
+    
+        <div id="el">
+            {{massge}}<br>
+            {{massge}}<br>
+            {{mulit.msg}}<br>
+            {{show}}<br>
+            {{date}}
+        </div>
+    
+    </div>
+    
+    
+    <script>
+        let vm2 = new Vue({
+            el:'#el2',
+            data:{
+                message:''+ new Date().toLocaleString()//中国标准时间
+            }
+        })
+        let vm = new Vue({
+            el:'#el',
+            data:{
+                massge:'炸鸡',
+                show:'嘿嘿',
+                mulit:{
+                    msg:'快乐水'
+                },
+                date:'炸鸡+快乐水=嘿嘿！'
+            }
+        });
+
+        
+        //在后台打印
+        console.log(vm.$el);
+        //原生的js获取
+        console.log(document.getElementById('el2'));
+        //data数据调用
+        console.log(vm.massge);
+        console.log(vm.$data.show);  
+        console.log(vm.mulit.msg);      
+    </script>
+</body>
+</html>
\ No newline at end of file
-- 
Gitee

