1.动态组件:顾名思义,能够动态切换的组件。

2.is:使用<component>配合is特性实现动态组件。
image.png
小提示:尽可能少的使用内联样式,层级深了之后会很麻烦

看结果,点击前:
image.png
点击后:
image.png
3.keep-alive:由于动态组件在使用时会发生组件的销毁和重新创建,所以极其耗费性能。而keep-alive的功能就是将失活的组件缓存起来,以便下次使用。先上代码:
image.png
开始重现:失活后再重新创建
image.png
image.png
image.png
image.png
image.png
开始重现:失活后缓存起来
image.png
image.png
image.png
关键的地方:
image.png


野望
18 声望4 粉丝

一个为了写出漂亮代码而努力的前端人