Vue3知识点一

• 生命周期
  • setup (beforeCreate和created)
  • onBeforeMount
  • onMounted
  • onBeforeUpdate
  • onUpdated
  • onBeforeUnMount
  • onUnMounted
• 新增钩子函数：
  • onRenderTracked：当组件渲染过程中追踪到响应式依赖时调用
  • onRenderTriggered：当响应式依赖的变更触发了组件渲染时调用
  • 这两个钩子函数在开发者模式下可用，且在服务器端渲染期间不会被调用
• ref 获取DOM元素 获取组件 操作在onMounted生命周期里
• toRefs：可以将一个响应式reactive对象的所有原始属性转换为响应式的ref属性
• hook函数：类似于mixin    将相同功能的代码进行封装

• 跳转传参
• 声名式
  • router-link to

• 函数式
  • useRouter() 跳转
  • useRoute() 接收参数
• readonly 与 shallowReadonly
  • readonly 只读
  • shallowReadonly 浅只读 深层的数据不是只读的
• shallowReactive 与 shallowRef
  • shallowReactive：只对根属性进行响应式处理，不会递归到对象的嵌套属性。当对浅响应式对象进行操作时，只有根属性的变化会触发视图更新，嵌套属性不会触发
  • shallowRef ：只会监听到根属性的变化并将变化通知给视图。使用shallowRef包装一个对象时，对该对象内部属性的修改不会被监听，只有重新赋值整个对象的操作才会引起响应式更新
• toRaw和markRaw
  • toRaw：代理对象的原始为代理版本，有助于直接访问原始值，而不是代理
  • markRaw：用于标记一个对象，使其永远不会被转为响应式对象
• toRef和toRefs
  • toRef：把单个的reactive对象属性转为ref对象属性（两个值，第一个是响应式对象，第二个是响应式对象的属性名）
  • toRefs：把多个reactive对象属性转为ref对象
• customRef：允许开发者创建自定义的ref对象，通过定义get和set方法的工厂函数来实现特定的ref逻辑，可以实现更灵活的响应式逻辑
• provide和inject 组件传参 爷孙传参
  • provide：在父组件中调用的方法，向子组件提供数据（键值对形式），子组件通过inject接受
  • inject：子组件中调用的方法，从夫组件的provide中接受数据（数组或对象）
• 响应式数据判断
  • isRef 是不是ref声明的
  • isReactive 是不是reactive声明的
  • isReadonly 是不是只读