From 04147ac2cb4092809d498cb01a53a0953dae61a4 Mon Sep 17 00:00:00 2001
From: chengjianlong <2353145581@qq.com>
Date: Mon, 31 May 2021 23:23:29 +0800
Subject: [PATCH 1/2] tj

---
 .../5.25.md"                                  | 27 ++++++++++
 .../5.26.md"                                  | 12 +++++
 .../5.28.md"                                  |  9 ++++
 .../5.29.md"                                  | 52 +++++++++++++++++++
 4 files changed, 100 insertions(+)
 create mode 100644 "\351\231\210\345\273\272\351\276\231/5.25.md"
 create mode 100644 "\351\231\210\345\273\272\351\276\231/5.26.md"
 create mode 100644 "\351\231\210\345\273\272\351\276\231/5.28.md"
 create mode 100644 "\351\231\210\345\273\272\351\276\231/5.29.md"

diff --git "a/\351\231\210\345\273\272\351\276\231/5.25.md" "b/\351\231\210\345\273\272\351\276\231/5.25.md"
new file mode 100644
index 0000000..244b8df
--- /dev/null
+++ "b/\351\231\210\345\273\272\351\276\231/5.25.md"
@@ -0,0 +1,27 @@
+# Vue的第一天
++ Vue是前端三大款架之一，另外两个是谷歌的Angular，faceboo的React
++ Vue是渐进式框架使用它有更多的选择可以使用别的组件
++ <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>引入框架
++ Vue可以在前端进行设计
++ Vue的一些用法
+```
+<div id="app">
+        <span v-bind:title="msg">
+            素还真
+        </span>
+        <p v-if="seen">看</p>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
+    <script>
+
+        var app = new Vue({
+            el:'#app',
+            data(){
+                return{
+                    msg:"半神半圣亦半仙，全儒全道是全贤",
+                    seen:false
+                }
+            }
+        })
+```
\ No newline at end of file
diff --git "a/\351\231\210\345\273\272\351\276\231/5.26.md" "b/\351\231\210\345\273\272\351\276\231/5.26.md"
new file mode 100644
index 0000000..44ba84d
--- /dev/null
+++ "b/\351\231\210\345\273\272\351\276\231/5.26.md"
@@ -0,0 +1,12 @@
+# Vue的第二天
+* Vue.component可以自定义一个标签
+* 通过props里的命名来获取内容然后进行template里设置好的操作
+* v-bind:pros中的命名 <---通过这段代码放在标签中获取
+```
+Vue.component("todo",{
+            props:["valuse"],
+            template:`<li>{{valuse.do}}</li>`
+        })
+```
+* v-model="" 可以选择定义的对象来获取标签中的值
+* v-for="xxx in yyy" {{xxx.valuse}} 来遍历输出
\ No newline at end of file
diff --git "a/\351\231\210\345\273\272\351\276\231/5.28.md" "b/\351\231\210\345\273\272\351\276\231/5.28.md"
new file mode 100644
index 0000000..fd414b1
--- /dev/null
+++ "b/\351\231\210\345\273\272\351\276\231/5.28.md"
@@ -0,0 +1,9 @@
+# Vue的第三天
+* 创建一个实例的过程叫做生命周期
+* 生命周期中可以添加生命周期钩子(Vue实例的一些属性)
+* mounted、updated 和 destroyed 等等就是生命周期钩子
+* mounted检测el是否有挂载标签
+* created可以查看实例初始化
+* beforeUpdate在data数据被改变后触发
+* updated表示更新DOM完成
+* data中的数据可以传入一个对象
\ No newline at end of file
diff --git "a/\351\231\210\345\273\272\351\276\231/5.29.md" "b/\351\231\210\345\273\272\351\276\231/5.29.md"
new file mode 100644
index 0000000..94264b2
--- /dev/null
+++ "b/\351\231\210\345\273\272\351\276\231/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 e3c7604588aaf59c7caa836ae361b379574b298a Mon Sep 17 00:00:00 2001
From: dasd <das>
Date: Tue, 1 Jun 2021 11:03:44 +0800
Subject: [PATCH 2/2] t

---
 "\351\231\210\345\273\272\351\276\231/6.1.md" | 45 +++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 "\351\231\210\345\273\272\351\276\231/6.1.md"

diff --git "a/\351\231\210\345\273\272\351\276\231/6.1.md" "b/\351\231\210\345\273\272\351\276\231/6.1.md"
new file mode 100644
index 0000000..74c8339
--- /dev/null
+++ "b/\351\231\210\345\273\272\351\276\231/6.1.md"
@@ -0,0 +1,45 @@
+# vue的第五天
+## Class 与 Style 绑定
+### HTML Class的对象绑定
++ 我们可以传给 v-bind:class 一个对象，以动态地切换 class：
+```
+<div v-bind:class="{ active: isActive }"></div>
+```
++ 或者
+```
+<div id="app">
+        <span :class="a">ljj</span>
+    </div>
+     a:{
+                    ljj:true,
+                    zyx:false
+                    
+                }
+```
++ 上面的语法表示 active 这个 class 存在与否将取决于数据 property isActive 的 truthiness。
++ 通过true和false切换状态 
++ 也可以数组
+```
+<div v-bind:class="[activeClass, errorClass]"></div>
+data: {
+  activeClass: 'active',
+  errorClass: 'text-danger'
+}
+<div class="active text-danger"></div
+```
+### 绑定内联样式
++ 绑定一个样式对象比较清晰
+```
+<div v-bind:style="styleObject"></div>
+data: {
+  styleObject: {
+    color: 'red',
+    fontSize: '13px'
+  }
+}
+```
++ 数组语法
++ v-bind:style 的数组语法可以将多个样式对象应用到同一个元素上：
+```
+<div v-bind:style="[baseStyles, overridingStyles]"></div>
+```
\ No newline at end of file
-- 
Gitee