From 51855b3d23384c27e2898b2a218e32139f93521c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E5=A6=99=E5=A8=9F?= <2949988397@qq.com>
Date: Thu, 31 Mar 2022 08:11:16 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BD=9C=E4=B8=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../firstVue.html"                            | 22 +++++++
 .../demo.html"                                | 61 +++++++++++++++++++
 ...\350\241\250\346\270\262\346\237\223.html" | 29 +++++++++
 ...\345\220\254\344\272\213\344\273\266.html" | 34 +++++++++++
 ...\345\215\225\347\273\221\345\256\232.html" | 37 +++++++++++
 5 files changed, 183 insertions(+)
 create mode 100644 "\345\274\240\346\241\202\345\234\206/2022-0329-Vue\347\254\254\344\270\200\346\254\241\344\275\234\344\270\232/firstVue.html"
 create mode 100644 "\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/demo.html"
 create mode 100644 "\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\345\210\227\350\241\250\346\270\262\346\237\223.html"
 create mode 100644 "\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\347\233\221\345\220\254\344\272\213\344\273\266.html"
 create mode 100644 "\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\350\241\250\345\215\225\347\273\221\345\256\232.html"
diff --git "a/\345\274\240\346\241\202\345\234\206/2022-0329-Vue\347\254\254\344\270\200\346\254\241\344\275\234\344\270\232/firstVue.html" "b/\345\274\240\346\241\202\345\234\206/2022-0329-Vue\347\254\254\344\270\200\346\254\241\344\275\234\344\270\232/firstVue.html"
new file mode 100644
index 0000000..29badc4
--- /dev/null
+++ "b/\345\274\240\346\241\202\345\234\206/2022-0329-Vue\347\254\254\344\270\200\346\254\241\344\275\234\344\270\232/firstVue.html"
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
+</head>
+<body>
+    <div id="el">
+        {{message}}
+    </div>
+</body>
+<script>
+    let vm = new Vue({
+        el:'#el',
+        data:{
+            message:'Hello Vue'
+        }
+    })
+</script>
+</html>
\ No newline at end of file
diff --git "a/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/demo.html" "b/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/demo.html"
new file mode 100644
index 0000000..15778ab
--- /dev/null
+++ "b/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/demo.html"
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
+</head>
+
+<body>
+    <div id="app">
+        <div>{{text}}我后面还有哟</div>
+        <div v-text='text'>我这里也有哼！</div>class
+        <div v-html='html'>我是html元素</div>
+        <div v-bind:id='"a_"+id+"_b"'></div>
+        <div v-bind:class='class1'>我是class</div>
+        <div v-bind:disabled='dis'>显示与不显示2222</div>
+        <!----todo--->
+        <button v-bind:disabled="dis">Button</button>
+        <div>{{num+'我是后续的输出'}}</div>
+        <div>{{ok?'输出ok':'输出不ok'}}</div>
+        <div>{{val.trim()}}</div>
+        <div>{{echo(val)}}</div>
+        <div v-if="result">if 显示？？？？？</div>
+        <div v-else="result">else 显示!!!!!!!!!</div>
+        <div v-show="result">show的显示？？？？？</div>
+        <div v-on:click="click">点击</div>
+        <div v-on:click="click2()">点击2</div>
+    </div>
+</body>
+<script>
+    let data = {
+        text: '文本输出',
+        html: '<span style="color:red">我是HTML元素</span>',
+        id: 'demo2',
+        class1: undefined,
+        dis: false,
+        num: 1000,
+        ok: false,
+        val: '  前面有空格，后面也有空格     ',
+        result: false,
+
+    }
+    let vm = new Vue({
+        el: '#app',
+        data: data,
+        methods: {
+            echo: function (a) {
+                let b = a;
+                return b;
+            },
+            click: function () {
+                alert('click')
+            }
+        }
+
+    })
+</script>
+
+</html>
\ No newline at end of file
diff --git "a/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\345\210\227\350\241\250\346\270\262\346\237\223.html" "b/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\345\210\227\350\241\250\346\270\262\346\237\223.html"
new file mode 100644
index 0000000..9c87707
--- /dev/null
+++ "b/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\345\210\227\350\241\250\346\270\262\346\237\223.html"
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
+</head>
+
+<body>
+    <div id="el">
+        <ul>
+            <li v-for="item in book">
+                {{item}}
+            </li>
+        </ul>
+    </div>
+</body>
+<script>
+    let vm = new Vue({
+        el: '#el',
+        data: {
+            book: ['Vue从入门到精通', 'java', 'web前端']
+        }
+    })
+</script>
+
+</html>
\ No newline at end of file
diff --git "a/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\347\233\221\345\220\254\344\272\213\344\273\266.html" "b/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\347\233\221\345\220\254\344\272\213\344\273\266.html"
new file mode 100644
index 0000000..0148343
--- /dev/null
+++ "b/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\347\233\221\345\220\254\344\272\213\344\273\266.html"
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
+</head>
+<body>
+    <div id='el'>
+        <h2>当前计数:{{counter}}</h2>
+        <!-- <button v-on:click='counter++'>+</button>
+        <button v-on:click='counter--'>-</button> -->
+        <button v-on:click='add'>+</button>
+        <button v-on:click='sub'>-</button>
+    </div>
+</body>
+<script>
+    let vm = new Vue({
+        el:'#el',
+        data:{
+            counter:0
+        },
+        methods:{
+            add:function(){
+                this.counter++
+            },
+            sub:function(){
+                this.counter--
+            }
+        }
+    })
+</script>
+</html>
\ No newline at end of file
diff --git "a/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\350\241\250\345\215\225\347\273\221\345\256\232.html" "b/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\350\241\250\345\215\225\347\273\221\345\256\232.html"
new file mode 100644
index 0000000..9cd7a06
--- /dev/null
+++ "b/\345\274\240\346\241\202\345\234\206/2022-0330-Vue\347\254\254\344\272\214\346\254\241\344\275\234\344\270\232/\350\241\250\345\215\225\347\273\221\345\256\232.html"
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
+</head>
+
+<body>
+    <div id='el'>
+        <input v-model='message' type="text">
+        <p>message is : {{message}} </p>
+        <br>
+        <textarea v-model='textarea'></textarea>
+        <p>多行文本内容: {{textarea}} </p>
+        <br>
+        <!-- 复选框 -->
+        <input type="checkbox" id="checkbox" v-model="checked">
+        <label for="checkbox">{{ checked }}</label>
+
+    </div>
+</body>
+<script>
+    let vm = new Vue({
+        el: '#el',
+        data: {
+            message: '',
+            textarea: '',
+            checked:'',
+        },
+
+    })
+</script>
+
+</html>
\ No newline at end of file
-- 
Gitee

