Day24 动态组件 Dynamic Components

Keep-alive
有时我们会希望资料状态能够保存下来,避免再次载入时资料消失,这时我们的外层就会放上

范例
如下当放上了就会在first输入并点下second重新载入时,保留之前所加入的资料
!
https://ithelp.ithome.com.tw/upload/images/20211008/20140076bGkbv89zMD.png

常用属性

• include : 字串、表达式、阵列→只有在名称相同的元件才会被缓存
  
• exclude : 字串、表达式、阵列→名称相同的元件都不会被缓存
• max : 数字→缓存元素实例最大数字为了效能不被过多的缓存降低,因此我们可以设定最多要保留几组
  

小提醒 : 一次仅渲染一个子元素,若使用v-for则不会触发

今天介绍了动态组件,这个功能可说是非常的实用,确保着资料的保存,include与exclude可以设定是否保留资料,max则可以设定保存数量的上限,明天会来介绍非动态组件

参考资料: https://vuejs.org/v2/api/#keep-alive
https://vuejs.org/v2/guide/components-dynamic-async.html#Async-Components