1.动态组件
动态组件是使用
component组件，通过一个特殊的属性is来实现
比如我们现在要实现点击一个tab-bar，切换不同的组件显示
实现一：通过v-if判断
实现二：动态组件
注意：:is的值必须是全局或者局部注册的组件
如果我们实现动态组件的相互通信可以直接给component传递porps或者监听emit事件
页面显示：
2.keep-alive
开发中某些情况我们希望继续保持组件的状态，而不是销毁掉，这个时候我们就可以使用一个内置组件
keep-alive
此时我们在上面的案例中增加一个按钮计数，我们希望给切换组件再回来的时候计数的状态不会丢失
keep-alive属性
pinclude - string | RegExp | Array。只有名称匹配的组件会被缓存
exclude - string | RegExp | Array。任何名称匹配的组件都不会被缓存
max - number | string。最多可以缓存多少组件实例，一旦达到这个数字，那么缓存组件中最近没有被访问的实例会被销毁
include和 exclude 匹配时首先会检查组件自身的 name 选项：
缓存组件的生命周期
缓存的组件，再次进入时是不会执行
created或者mounted等生命周期函数的我们如果需要监听何时离开或者重进了该组件，我们可以使用
activated和deactivated这两个生命周期钩子函数来监听
3.Webpack的代码分包
默认情况下，在构建整个组件树的过程中，因为组件和组件之间是通过模块化直接依赖的，那么webpack在打包时就会将组件模块打包到一起（比如一个app.js文件中）
当随着着项目的不断庞大，app.js文件的内容过大，会造成首屏的渲染速度变慢
对于一些不需要立即使用的组件，我们可以单独对它们进行拆分，拆分成一些小的代码块chunk.js
这些chunk.js会在需要时从服务器加载下来，并且运行代码，显示对应的内容
4.异步组件
在大型项目中，我们可能需要拆分应用为更小的块，并仅在需要时再从服务器加载
对于某些组件希望通过异步的形式加载，那 么Vue中给我们提供了一个
defineAsyncComponent函数
defineAsyncComponent函数接受两种类型参数
- 工厂函数，该工厂函数需要返回一个Promise对象
- 接受一个对象类型，对异步函数进行配置
工厂函数，写法一：
接受一个对象类型，对异步函数进行配置，写法二：
5.元素和组件的引用
$refs
在Vue组件中想要直接获取到元素对象或者子组件实例，不推荐DOM操作，我们可以给元素或组件绑定一个ref的属性
应用在html标签上获取的是真实DOM元素，应用在组件标签上是组件实例对象
当 ref 在 v-for 中使用时，相应的 ref 中包含的值是一个数组：
root
Vue3中已经移除了$children的属性
我们可以通过$parent来访问父元素
$root获取对应的根组件
6.生命周期
又名：生命周期回调函数、生命周期函数、生命周期钩子
Vue在关键时刻帮我们调用的一些特殊名称的函数
通过对生命周期函数的回调，我们可以知道目前组件正在经历什么阶段，在对应阶段做对应操作
常用的生命周期钩子：
- mounted: 发送ajax请求、启动定时器、绑定自定义事件、订阅消息等【初始化操作】
- beforeDestroy: 清除定时器、解绑自定义事件、取消订阅消息等【收尾工作】
关于销毁Vue实例
- 销毁后借助Vue开发者工具看不到任何信息
- 自定义事件会失效，但原生DOM事件依然有效
- 一般不会在beforeDestroy操作数据，因为即便操作数据，也不会再触发更新流程了
7.组件的v-model
之前使用input的v-model实现双向数据绑定，因为为v-model默认帮助我们完成了两件事
v-bind:value的数据绑定和@input的事件监听
如今我们封装一个input组件也同样可以完成这个功能
使用的父组件：
yunInput组件：
如果我们希望组件内部依然使用v-model来实现，可以使用计算属性的setter和getter 来完成
默认情况下的v-model其实是绑定了 modelValue 属性和 @update:modelValue的事件
此外绑定多个v-model，此处v-model:title相当于绑定了title属性和监听了 @update:title 的事件
8.Mixin
如果我们希望对代码中的相同逻辑抽离
Vue2和Vue3中都支持的一种方式就是使用Mixin来完成
Mixin可以包含任何组件选项，当组件使用Mixin对象时，所有Mixin对象的选项将被混合进入该组件本身的选项中
局部混入
全局混入
如果组件中的某些选项，是所有的组件都需要拥有的，那么这个时候我们可以使用全局的mixin
全局的Mixin可以使用 应用app的方法 mixin 来完成注册
一旦注册，那么全局混入的选项将会影响每一个组件
Mixin的合并规则
如果Mixin对象中的选项和组件对象中的选项发生了冲突，要分为不同情况
- 如果是data函数的返回值默认情况下会进行合并，如果冲突，则保留组件自身数据
- 生命周期的钩子函数会被合并到数组中，都会被调用
- 值为对象的选项，例如 methods、components 和 directives，将被合并为同一个对象，如果产生冲突，依然以组件自身为主
