列表

详情


43. 说一说 vue 的 keep-alive ?

回答思路

得分点 缓存组件、条件缓存、路由配合条件缓存、不重新加载、activated、deactivated 标准回答 `<keep-alive>`作用:缓存组件,提升性能,避免重复加载一些不需要经常变动且内容较多的组件。 `<keep-alive>`的使用方法:使用`<keep-alive>`标签对需要缓存的组件进行包裹,默认情况下被`<keep-alive>`标签包裹的组件都会进行缓存,区分被包裹的组件是否缓存有两种方法,第一种是给keepalive 添加属性,组件名称指的是具体组件添加的name,不是路由里面的name。include 包含的组件(可以为字符串,数组,以及正则表达式,只有匹配的组件会被缓存)。exclude 排除的组件(以为字符串,数组,以及正则表达式,任何匹配的组件都不会被缓存)。第二种也是最常用的一种是,和路由配合使用:在路由中添加meta属性。 使用keepalive导致组件不重新加载,也就不会重新执行生命周期的函数,如果要解决这个问题,就需要两个属性进入时触发:activated 退出时触发:deactivated 加分回答 `<keep-alive>`适用的场景:首页展示固定数据的组件,比如banner九宫格</keep-alive></keep-alive></keep-alive></keep-alive></keep-alive>

上一题