vue学习笔记

表单的输入和绑定 使用v-model, 可以用于各种不同的输入,<input>``<textarea>``<select>元素。它会根据所使用的元素自动使用对应的 DOM 属性和事件组合： 文本类型的

总结 侦听器允许在响应式变量状态变化时执行一些“副作用“（更新其他的响应式变量，更像DOM） 在组合式 API 中常用的有watch、watchEffect函数 侦听数据的类型：watch 的第一个参

表单的输入和绑定 使用v-model, 可以用于各种不同的输入,<input>``<textarea>``<select>元素。它会根据所使用的元素自动使用对应的 DOM 属性和事件组合： 文本类型的

生命周期钩子 每个 Vue 组件实例在创建时都需要经历一系列的初始化步骤，比如设置好数据侦听，编译模板，挂载实例到 DOM，以及在数据改变时更新 DOM。在此过程中，它也会运行被称为生命周期钩子的函数

组件基础 组件允许我们将 UI 划分为独立的、可重用的部分，并且可以对每个部分进行单独的思考。在实际应用中，组件常常被组织成层层嵌套的树状结构。 这和我们嵌套 HTML 元素的方式类似，Vue 实现了

v-on或@绑定DOM是事件 事件处理器的值可以是: 内联事件处理器：事件被触发时执行的内联 JavaScript 语句 (与 onclick 类似)。 方法事件处理器：一个指向组件上定义的方法的属性

v-for 在 v-for 块中可以完整地访问父作用域内的属性和变量。v-for 也支持使用可选的第二个参数表示当前项的位置索引。对应数组遍历中的(value,index) v-for="(item,

v-if v-else-if v-else 根据是否真值渲染或销毁. v-show 只是切换style的display属性 v-if 是“真实的”按条件渲染，因为它确保了在切换时，条件区块内的事件监听

:class 传递一个对象, 属性值isActive是真假值(一般是响应变量)<div :class="{active: isActive}"> <div/> :class 指令也可以和一般的 cla

使用计算属性来描述依赖响应式状态的复杂逻辑,在template中使用计算属性,提高可读性 返回值为一个计算属性 ref, 可以通过 .value访问计算结果,在模版中自动解包 Vue 的计算属性会自动

ref ref接收参数，并将其包裹在一个带有 .value 属性的 ref 对象中返回，在js中需要.value才能访问，在模板中使用 ref 时，我们不需要附加 .value当在模板中使用时，ref

模版： 基于html，能够声明式地将其组件实例的数据绑定到呈现的 DOM 上 文本插值： {{msg}} 双大括号标签会被替换为相应组件实例中 msg 属性的值。同时每次 msg 属性更改时它也会同步

创建一个应用 每个 Vue 应用都是通过 createApp 函数创建一个新的 应用实例 传入create的对象实际上就是一个组件，这就创造了一个根组件，也可以从一个单文件组件(.vue)中导入 mo

声明式渲染 、响应式状态、响应式api、插值语法{{}}、v-if、v-on、v-if、v-show、v-for