Vue

背景 下载安装Vue3的脚手架 任意磁盘根目录新建一个文件夹用来存放 Vue3的脚手架，比如就叫 Vue3，但是需要注意的是，这个文件夹的名字不能包含中文字符 在 Vue3 文件夹的目录中打开 cmd

pinia是什么？ 这个是 vue3 新的状态管理工具，简单来说相当于之前 vuex，它去掉了 Mutations 但是也是支持 vue2 的，尤大推荐。因为其logo像是一个菠萝，所以我们还称呼它为

常用的 Composition API（组合API） setup Vue3.0新增的配置项，值为一个函数 setup是所有Composition API的 组件中所用到的：数据，方法等等，均需要配置在

Suspense 以上是官方的警告！ 等待异步组件渲染一些额外的内容，让应用有更好的用户体验 <suspense> 组件有两个插槽。它们都只接收一个直接子节点。default 插槽里的节点会尽可能展示

customRef 作用：创建一个自定义的ref，并对其依赖项跟踪和更新触发进行显式控制。 demo：实现输入数据，防抖效果

provide和inject 作用：实现祖孙组件间通信,即父组件定义，后面所有子代组件都能用 套路：父组件有一个provide选项来提供数据，后代组件有一个inject选项来开始使用这些数据

什么是hook 本质是一个函数，把setup函数中使用的composition API进行了封装 类似于Vue2中的mixin 其优势，复用代码，让setup中的逻辑更清楚易懂 Demo hook函数

computed 简写和完整版写法和Vue2都一样，只是使用不一样，需要单独引入使用，变成了一个函数

watchEffect函数 watch：需要指明监视的属性，也要指明监视的回调 watchEffect：不需要指明监视哪个竖向，监视的回调中用到哪个属性，就监视那个属性 watchEffect有点类似

watch 和Vue2基本相似，配置是一样的 两个坑： 监视reactive定义的响应式数据时：oldVal无法正确的获取，强制开启了深度监视（deep配置无效） 监视reactive定义的响应式数据

ref函数 作用：定义一个响应式的数据，或者说是生成一个引用实现对象 语法：const xxx = ref(initValue) 创建一个包含响应式数据的引用对象（reference对象） JS中操作

setup Vue3.0新增的配置项，值为一个函数 setup是所有Composition API的 组件中所用到的：数据，方法等等，均需要配置在setup函数中 setup函数的两种返回值： 若返回

Proxy简介 Proxy 也就是代理，它是window内置的函数，我们直接window.Proxy就可以使用 语法 使用 Vue3中还使用啥 Vue3.0中对于值得操作还使用了Reflect

Vue3和Vue2生命周期对比 更名 beforeDestroy改名为beforeUnmount destroyed改名为unmounted Vue3中提供了Composition API形式的生命周

使用 作用 在下一次DOM更新结束后执行其指定的函数 什么时候用 在改变数据后，要基于更新后的DOM进行某些操作时，要在nextTick指定的回调函数中执行 demo

全局路由守卫 独享路由守卫 只有前置，没有后置，需要的话使用全局后置路由 组件内路由守卫 注意：这种方式就不是前置，后置了，而是进入和离开路由守卫

Vue Router官方介绍 Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得易如反掌。包含的功能有： 嵌套的路由/视图表 模块化的、

Vuex是什么 概念：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。适用于任意组件之间通信

基本概念 Vue给我们提供的一个内置组件 Vue 在插入、更新或者移除 DOM 时，提供多种不同方式的应用过渡效果 使用方法 1.用v-if/v-show控制显示隐藏，使用transition组件控制

初步了解 功能：用于增强Vue 本质：包含install方法的一个对象，install的第一个参数是Vue，第二个以后的参数是插件使用者传递的数据。 使用插件 定义一个插件