一、动态组件：

1、组件的渲染需要依赖用户的操作而决定。

2、由vue提供的内置组件作为容器.

3、在component 标签里面写子组件的prop。

二、 keep-alive:是vue提供的内置组件

在切换组件时

1、缓存组件；

2、保持组件的状态；

3、解决反复创建组件导致性能问题。

用法：用keep-alive包裹组件，

1、提供include和exclude两个prop,选择需不需要缓存的组件,默认是include。

2、提供max属性，限制最大缓存组件数量，如果超出最大值，则最久没有被渲染的组件会销毁。

3、组件的切换会执行相应的钩子函数 activated （显示）和 deactivated （隐藏）

4、activated 在组件挂载时也会调用，并且 deactivated 在组件卸载时也会调用。

5、这两个钩子不仅适用于  缓存的根组件，也适用于缓存树中的后代组件。

三、动态组件

静态导入模块：

import xx from './xx.js'，

动态导入模块:

import('./xx.js').then(resp=>{

//resp 是一个module

)

1、import是关键字并不是方法、不是方法、不是方法。类似于typeof 、delete。

2、每一个import都会从服务器下载一个模块。

注意：import（） 导入的时一个promise对象

if(typeof str ===''string) // if(tyoeof(str)==='string')

vue3中动态导入组件：

vue2中动态导入组件：

动态组件的特点：

1、按需加载组件，实现延时加载 ；

2、异步组件被分割成一个代码块，在需要的时候从服务器下载并渲染；

3、减少父组件的体积。