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 44ba84d44cd6cd4d40e4d535530f2a77a254521e..bf29372e0ad21cc9d3c81c0650c52a5ae8d8aa1c 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-5-29.md" "b/\345\210\230\346\263\242/2021-5-29.md"
new file mode 100644
index 0000000000000000000000000000000000000000..94264b28d56205ec479a38c9d4305c5d8d6a8356
--- /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
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 0000000000000000000000000000000000000000..5ed3a58a039cf42541a80b431c04926d25e09170
--- /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