目录
一、Vue2 选项式 API & Vue3 组合式 API
二、create-vue 搭建 Vue3 项目
三、熟悉项目目录和关键文件
四、组合式API — setup选项
五、组合式API — reactive 和 ref 函数
六、组合式API — computed 计算属性
七、组合式API — watch
八、组合式API — 生命周期函数
九、组合式API — 父子通信
十、组合式API — 模板引用
十一、组合式API — provide 和 inject
一、Vue2 选项式 API & Vue3 组合式 API
二、create-vue 搭建 Vue3 项目
1. 认识create-vue
2. 使用 create-vue 创建项目
创建一个vue应用 npm init vue@latest
三、熟悉项目目录和关键文件
允许我们在项目中用@去访问目录
导完就能用，不需要注册
四、组合式API — setup选项
<script setup> 语法糖
五、组合式API — reactive 和 ref 函数
reactive()
作用：接收对象类型的数据，返回一个响应式对象
ref()
作用：接收简单类型或对象类型的数据，返回一个响应式对象
六、组合式API — computed 计算属性
七、组合式API — watch
作用：监听一个或多个数据的变化，数据变化时执行回调函数
额外两个参数：immediate（立即执行）
deep（深度监听）
监听一个
监听多个
携带两个参数
深度监视，监视的是整个对象加对象里面的所有属性
精确监听对象的某个属性
需求：在不开启deep的前提下，监听age的变化
八、组合式API — 生命周期函数
beforeCreate 和 created 相关的代码一律放在 setup 里
如果一些代码需要在 mounted生命周期中执行，放在 onMounted 里
九、组合式API — 父子通信
父传子
子传父
十、组合式API — 模板引用
概念：通过 ref标识 获取 dom 或 组件
获取dom
获取组件（通常是为了拿到组件里面的属性和方法）
十一、组合式API — provide 和 inject
顶层组件向任意的底层组件传递数据和方法，实现跨层组件通信
跨层传递简单响应式数据
在底层修改数据
跨层传递复杂响应式数据