From 96e4adab8ada78fefedde87c724c7e50554bea5e Mon Sep 17 00:00:00 2001
From: Liou <1509145823@qq.com>
Date: Sat, 29 May 2021 17:41:06 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 "\345\210\230\346\263\242/2021-5-29.md" | 52 +++++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 "\345\210\230\346\263\242/2021-5-29.md"

diff --git "a/\345\210\230\346\263\242/2021-5-29.md" "b/\345\210\230\346\263\242/2021-5-29.md"
new file mode 100644
index 0000000..94264b2
--- /dev/null
+++ "b/\345\210\230\346\263\242/2021-5-29.md"
@@ -0,0 +1,52 @@
+# Vue的第四天
+* v-html指令可以实现html代码
+```
+<p v-html="msg" v-bind:title="msg1"></p>
+```
+```
+msg: "<h1>不吃cuo来之食</h1>"
+```
+* v-bing可以作用于标签属性
+```
+<button v-bind:disabled="pool" >盖亚</button>
+```
+* v-on可以绑定DOM节点事件
+```
+<button v-bind:disabled="pool" v-on:click="btnClick">盖亚{{string}}</button>
+
+```
+```
+methods:{
+                btnClick:function(){
+                     this.string+="!"
+                }
+            }
+```
+* 动态参数
+```
+data: {
+                string: "",
+                msg: "<h1>不吃cuo来之食</h1>",
+                msg1: "太上老君急急如律令",
+                pool: false,
+                stringarr: ["!", "ovo", "qaq"]
+            },
+            methods: {
+                btnClick: function () {
+                    let rnd = Math.floor(Math.random() * this.stringarr.length);
+                    console.log(rnd);
+                    let str = this.stringarr[rnd];
+                    console.log(str);
+                    this.string += `${str}`
+                }
+            }
+```
+* 侦听器第一个参数获取更改数据，第二个获取更改前数据
+```
+watch:{
+                name:function(newval,oldval){
+                    console.log(newval);
+                    console.log(oldval);
+                }
+            }
+```
\ No newline at end of file
-- 
Gitee


From 68c1840c49675b4bcbcb9c60cdd6881c7a6eae7e Mon Sep 17 00:00:00 2001
From: Liou <1509145823@qq.com>
Date: Tue, 1 Jun 2021 11:24:53 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 "\345\210\230\346\263\242/2021-5-26.md" | 17 +++++++--
 "\345\210\230\346\263\242/2021-6-1.md"  | 49 +++++++++++++++++++++++++
 2 files changed, 62 insertions(+), 4 deletions(-)
 create mode 100644 "\345\210\230\346\263\242/2021-6-1.md"

diff --git "a/\345\210\230\346\263\242/2021-5-26.md" "b/\345\210\230\346\263\242/2021-5-26.md"
index 44ba84d..bf29372 100644
--- "a/\345\210\230\346\263\242/2021-5-26.md"
+++ "b/\345\210\230\346\263\242/2021-5-26.md"
@@ -3,10 +3,19 @@
 * 通过props里的命名来获取内容然后进行template里设置好的操作
 * v-bind:pros中的命名 <---通过这段代码放在标签中获取
 ```
-Vue.component("todo",{
-            props:["valuse"],
-            template:`<li>{{valuse.do}}</li>`
-        })
+<todo  v-for="item in books" v-bind:bvalues="item"></todo>
+
+Vue.component("todo", {
+            props: ["bvalues"],
+            template: `<li>{{bvalues.name}}</li>`
+        });
+        
+let app = new Vue({
+            el: "#app",
+            data: {
+                books: [{ name: "《断头皇后》" }, { name: "《穷查理宝典》" }, { name: "《血酬定律》" }]
+            },
+        }) 
 ```
 * v-model="" 可以选择定义的对象来获取标签中的值
 * v-for="xxx in yyy" {{xxx.valuse}} 来遍历输出
\ No newline at end of file
diff --git "a/\345\210\230\346\263\242/2021-6-1.md" "b/\345\210\230\346\263\242/2021-6-1.md"
new file mode 100644
index 0000000..5ed3a58
--- /dev/null
+++ "b/\345\210\230\346\263\242/2021-6-1.md"
@@ -0,0 +1,49 @@
+# Vue的第五天
+## css
+* 可以在对象中传入css样式v-bind:class="对象"使用
+* 对象中的属性可以设置false,true决定是否调用
+```
+ <span :class="classname">我是一只小🐏</span>
+
+data: {
+                books: [{ name: "《断头皇后》" }, { name: "《穷查理宝典》" }, { name: "《血酬定律》" }],
+                classname:{
+                    sheep:true,
+                }
+            }
+```
+* class可以传数组和字符串
+```
+<span :class="list">我是一只小🐏</span>
+<span :class="class1">你可以在六一儿童节给我☘吗</span>
+
+let app = new Vue({
+            el: "#app",
+            data: {
+                books: [{ name: "《断头皇后》" }, { name: "《穷查理宝典》" }, { name: "《血酬定律》" }],
+                classname:{
+                    sheep:true,
+                },
+                class1:"今天打老虎",
+                list:["大象大象","你的鼻子和那个长"]
+            },
+        })
+```
+* 组件也可以设置样式，html里的css不会覆盖组件的css
+```
+Vue.component("todo", {
+            template: `<p class="sheep">ccc</p>`
+        });
+
+```
+### style
+* style也可以传入对象，对象当中定义属性和它的值
+```
+<span :class="class1" :style="styleobject">你可以在六一儿童节给我☘吗</span>
+data:{
+styleobject:{
+                    fontSize:"20px",
+                    color:"red"
+                }
+}
+```
\ No newline at end of file
-- 
Gitee