diff --git "a/41\345\274\240\347\205\234/.keep" "b/41\345\274\240\347\205\234/.keep"
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git "a/41\345\274\240\347\205\234/20230328-vue\346\230\257\344\273\200\344\271\210.md" "b/41\345\274\240\347\205\234/20230328-vue\346\230\257\344\273\200\344\271\210.md"
new file mode 100644
index 0000000000000000000000000000000000000000..47ae8b28fcc0b60c9f7b94928c261e82e9d23cb3
--- /dev/null
+++ "b/41\345\274\240\347\205\234/20230328-vue\346\230\257\344\273\200\344\271\210.md"
@@ -0,0 +1,31 @@
+Vue.js是什么？
+Vue（法语）同view(英语)
+
+ 
+Vue.js是一套构建用户界面（view）的MVVM框架。Vue.js的核心库只关注视图层，并且非常容易学习，非常容易与其他库或已有的项目整合。
+
+1.1 Vue.js的目的
+
+Vue.js的产生核心是为了解决如下三个问题：
+
+解决数据绑定的问题；
+
+Vue.js框架生产的主要目的是为了开发大兴单页面应用（SPA：Single Page Application）
+
+Angular.js中对PC端支持的比较良好，但是对移动端支持就一般。而Vue.js主要支持移动端，也支持PC端。
+
+3. 它还支持组件化。也就是可以将页面封装成若干个组件，采用积木式编程 ，这样是页面的复用度达到最高（支持组件化）。
+
+
+1.2 Vue.js特性
+MVVM模式
+M: model  业务模型，用处：处理数据，提供数据
+
+V: view    用户界面、用户视图业务模型model中的数据发生改变的时候，
+
+用户视图view也随之变化。用户视图view改变的时候，业务模型model中的数据也可以发生改变。
+
+组件化
+指令系统
+Vue.js 2.0开始支持虚拟DOM（Vue.js 1.0 是操作的真是DOM，而不是虚拟DOM）
+虚拟DOM可以提升页面的刷新速度。
\ No newline at end of file
diff --git "a/41\345\274\240\347\205\234/20230330-vue\351\241\271\347\233\256\345\210\233\345\273\272.md" "b/41\345\274\240\347\205\234/20230330-vue\351\241\271\347\233\256\345\210\233\345\273\272.md"
new file mode 100644
index 0000000000000000000000000000000000000000..a52719e3a5bfa5146eecc03befb4726e6343ad40
--- /dev/null
+++ "b/41\345\274\240\347\205\234/20230330-vue\351\241\271\347\233\256\345\210\233\345\273\272.md"
@@ -0,0 +1,72 @@
+第一种方法yarn创建项目
+首先环境都先整好
+
+node.js直接下一步就行：
+
+下载官网:Node.js (nodejs.org)
+
+1.首先全局安装webpack
+npm install webpack -g
+
+2.全局安装vue脚手架
+npm install -g @vue/cli-init
+
+3.安装Yarn
+yarn比npm更快更高效是Facebook发布的node.js包管理器
+
+安装命令:
+
+npm i yarn -g -verbose
+
+yarn安装之后把淘宝镜像给安装下
+
+yarn config set registry https://registry.npm.taobao.org
+
+注意vue和Yarn都需要配置环境变量
+
+生成项目:
+
+生成之前把环境换成: npm config set chromedriver_cdnurl https://npm.taobao.org/mirrors/chromedriver
+
+ vue init webpack 项目名
+
+安装依赖:
+
+　#进入项目
+
+　　cd 项目名
+
+　　#安装依赖
+
+　　yarn install
+
+　　#安装完成之后启动
+
+　　npm run dev
+
+第二种方法使用vue/cli创建
+vue create 项目名
+
+可以先进入一个目录方便找到
+
+cd D:
+
+D盘创建一个cs的文件夹并进入
+
+mkdir cs;
+
+cd cs;
+
+创建项目
+
+vue  create项目名
+
+ 选着最后一个features自定义（空格选着，回车确定）
+
+ 选择插件
+
+ 选着vue版本
+
+ 步骤如下:
+
+ 创建完成
\ No newline at end of file
diff --git "a/41\345\274\240\347\205\234/20230331-\346\250\241\346\235\277\350\257\255\350\250\200.md" "b/41\345\274\240\347\205\234/20230331-\346\250\241\346\235\277\350\257\255\350\250\200.md"
new file mode 100644
index 0000000000000000000000000000000000000000..f69e8e8d26bc9c6f6076a23791673e057e52c274
--- /dev/null
+++ "b/41\345\274\240\347\205\234/20230331-\346\250\241\346\235\277\350\257\255\350\250\200.md"
@@ -0,0 +1,242 @@
+## Attribute 绑定
+
+双大括号不能在 HTML attributes 中使用。想要响应式地绑定一个 attribute，应该使用 `v-bind` 指令：
+
+template
+
+```
+<div v-bind:id="dynamicId"></div>
+```
+
+`v-bind` 指令指示 Vue 将元素的 `id` attribute 与组件的 `dynamicId` 属性保持一致。如果绑定的值是 `null` 或者 `undefined`，那么该 attribute 将会从渲染的元素上移除。
+
+### 简写
+
+因为 `v-bind` 非常常用，我们提供了特定的简写语法：
+
+template
+
+```
+<div :id="dynamicId"></div>
+```
+
+开头为 `:` 的 attribute 可能和一般的 HTML attribute 看起来不太一样，但它的确是合法的 attribute 名称字符，并且所有支持 Vue 的浏览器都能正确解析它。此外，他们不会出现在最终渲染的 DOM 中。简写语法是可选的，但相信在你了解了它更多的用处后，你应该会更喜欢它。
+
+> 接下来的指引中，我们都将在示例中使用简写语法，因为这是在实际开发中更常见的用法。
+
+### 布尔型 Attribute
+
+布尔型 attribute依据 true / false 值来决定 attribute 是否应该存在于该元素上。`disabled`就是最常见的例子之一。
+
+`v-bind` 在这种场景下的行为略有不同：
+
+template
+
+```
+<button :disabled="isButtonDisabled">Button</button>
+```
+
+当 `isButtonDisabled` 为真值或一个空字符串 (即 `<button disabled="">`) 时，元素会包含这个 `disabled` attribute。而当其为其他假值时 attribute 将被忽略。
+
+### 动态绑定多个值
+
+如果你有像这样的一个包含多个 attribute 的 JavaScript 对象：
+
+js
+
+```
+data() {
+  return {
+    objectOfAttrs: {
+      id: 'container',
+      class: 'wrapper'
+    }
+  }
+}
+```
+
+通过不带参数的 `v-bind`，你可以将它们绑定到单个元素上：
+
+template
+
+```
+<div v-bind="objectOfAttrs"></div>
+```
+
+## 使用 JavaScript 表达式
+
+至此，我们仅在模板中绑定了一些简单的属性名。但是 Vue 实际上在所有的数据绑定中都支持完整的 JavaScript 表达式：
+
+template
+
+```
+{{ number + 1 }}
+
+{{ ok ? 'YES' : 'NO' }}
+
+{{ message.split('').reverse().join('') }}
+
+<div :id="`list-${id}`"></div>
+```
+
+这些表达式都会被作为 JavaScript ，以当前组件实例为作用域解析执行。
+
+在 Vue 模板内，JavaScript 表达式可以被使用在如下场景上：
+
+- 在文本插值中 (双大括号)
+- 在任何 Vue 指令 (以 `v-` 开头的特殊 attribute) attribute 的值中
+
+### 仅支持表达式
+
+每个绑定仅支持**单一表达式**，也就是一段能够被求值的 JavaScript 代码。一个简单的判断方法是是否可以合法地写在 `return` 后面。
+
+因此，下面的例子都是**无效**的：
+
+template
+
+```
+<!-- 这是一个语句，而非表达式 -->
+{{ var a = 1 }}
+
+<!-- 条件控制也不支持，请使用三元表达式 -->
+{{ if (ok) { return message } }}
+```
+
+### 调用函数
+
+可以在绑定的表达式中使用一个组件暴露的方法：
+
+template
+
+```
+<span :title="toTitleDate(date)">
+  {{ formatDate(date) }}
+</span>
+```
+
+TIP
+
+绑定在表达式中的方法在组件每次更新时都会被重新调用，因此**不**应该产生任何副作用，比如改变数据或触发异步操作。
+
+### 受限的全局访问
+
+模板中的表达式将被沙盒化，仅能够访问到有限的全局对象列表。该列表中会暴露常用的内置全局对象，比如 `Math` 和 `Date`。
+
+没有显式包含在列表中的全局对象将不能在模板内表达式中访问，例如用户附加在 `window` 上的属性。然而，你也可以自行在 `app.config.globalProperties`上显式地添加它们，供所有的 Vue 表达式使用。
+
+## 指令 Directives
+
+指令是带有 `v-` 前缀的特殊 attribute。Vue 提供了许多内置指令，包括上面我们所介绍的 `v-bind` 和 `v-html`。
+
+指令 attribute 的期望值为一个 JavaScript 表达式 (除了少数几个例外，即之后要讨论到的 `v-for`、`v-on` 和 `v-slot`)。一个指令的任务是在其表达式的值变化时响应式地更新 DOM。以 `v-if`为例：
+
+template
+
+```
+<p v-if="seen">Now you see me</p>
+```
+
+这里，`v-if` 指令会基于表达式 `seen` 的值的真假来移除/插入该 `<p>` 元素。
+
+### 参数 Arguments
+
+某些指令会需要一个“参数”，在指令名后通过一个冒号隔开做标识。例如用 `v-bind` 指令来响应式地更新一个 HTML attribute：
+
+template
+
+```
+<a v-bind:href="url"> ... </a>
+
+<!-- 简写 -->
+<a :href="url"> ... </a>
+```
+
+这里 `href` 就是一个参数，它告诉 `v-bind` 指令将表达式 `url` 的值绑定到元素的 `href` attribute 上。在简写中，参数前的一切 (例如 `v-bind:`) 都会被缩略为一个 `:` 字符。
+
+另一个例子是 `v-on` 指令，它将监听 DOM 事件：
+
+template
+
+```
+<a v-on:click="doSomething"> ... </a>
+
+<!-- 简写 -->
+<a @click="doSomething"> ... </a>
+```
+
+这里的参数是要监听的事件名称：`click`。`v-on` 有一个相应的缩写，即 `@` 字符。我们之后也会讨论关于事件处理的更多细节。
+
+### 动态参数
+
+同样在指令参数上也可以使用一个 JavaScript 表达式，需要包含在一对方括号内：
+
+template
+
+```
+<!--
+注意，参数表达式有一些约束，
+参见下面“动态参数值的限制”与“动态参数语法的限制”章节的解释
+-->
+<a v-bind:[attributeName]="url"> ... </a>
+
+<!-- 简写 -->
+<a :[attributeName]="url"> ... </a>
+```
+
+这里的 `attributeName` 会作为一个 JavaScript 表达式被动态执行，计算得到的值会被用作最终的参数。举例来说，如果你的组件实例有一个数据属性 `attributeName`，其值为 `"href"`，那么这个绑定就等价于 `v-bind:href`。
+
+相似地，你还可以将一个函数绑定到动态的事件名称上：
+
+template
+
+```
+<a v-on:[eventName]="doSomething"> ... </a>
+
+<!-- 简写 -->
+<a @[eventName]="doSomething">
+```
+
+在此示例中，当 `eventName` 的值是 `"focus"` 时，`v-on:[eventName]` 就等价于 `v-on:focus`。
+
+#### 动态参数值的限制
+
+动态参数中表达式的值应当是一个字符串，或者是 `null`。特殊值 `null` 意为显式移除该绑定。其他非字符串的值会触发警告。
+
+#### 动态参数语法的限制
+
+动态参数表达式因为某些字符的缘故有一些语法限制，比如空格和引号，在 HTML attribute 名称中都是不合法的。例如下面的示例：
+
+template
+
+```
+<!-- 这会触发一个编译器警告 -->
+<a :['foo' + bar]="value"> ... </a>
+```
+
+如果你需要传入一个复杂的动态参数，我们推荐使用计算属性替换复杂的表达式，也是 Vue 最基础的概念之一，我们很快就会讲到。
+
+当使用 DOM 内嵌模板 (直接写在 HTML 文件里的模板) 时，我们需要避免在名称中使用大写字母，因为浏览器会强制将其转换为小写：
+
+template
+
+```
+<a :[someAttr]="value"> ... </a>
+```
+
+上面的例子将会在 DOM 内嵌模板中被转换为 `:[someattr]`。如果你的组件拥有 “someAttr” 属性而非 “someattr”，这段代码将不会工作。单文件组件内的模板**不**受此限制。
+
+### 修饰符 Modifiers
+
+修饰符是以点开头的特殊后缀，表明指令需要以一些特殊的方式被绑定。例如 `.prevent` 修饰符会告知 `v-on` 指令对触发的事件调用 `event.preventDefault()`：
+
+template
+
+```
+<form @submit.prevent="onSubmit">...</form>
+```
+
+之后在讲到 `v-on` 和 `v-model` 的功能时，你将会看到其他修饰符的例子。
+
+最后，在这里你可以直观地看到完整的指令语法：
+
+[](./img/directive.69c37117.png)
\ No newline at end of file