kepp-alive的作用?keep-alive的属性?路由元信息？白名单黑名单?keep-alive的钩子函数

keep-alive它自身不会渲染一个dom元素，也不会出现在父组件中，作为标签使用包裹在需要缓存的组件外

路由元信息

如果要缓存部分页面可以使用路由元信息

<keep-alive><router-view v-if="!$route.meta.noneedCache"/></keep-alive><router-view v-if="$route.meta.noneedCache"></router-view>

在路由中与path，name同级定义meta

{path: '/live2',name: 'live2',component: () => import('../views/live2.vue'),meta:{noneedCache:true}},

这样就可以实现部分页面缓存也可以使用白名单黑名单

白名单黑名单

exclude黑名单是不需要缓存的组件

<keep-alive exclude="不需要缓存的路由名称"><router-view></router-view></keep-alive>

如果有多个路由不需要缓存需要用数组新建一个js文件引入

新建js文件

export default ['live1','live2']

引入js文件在data中定义空数组进行赋值

import exclude from "@/assets/excludes"
export default {data() {return {exdata:[]}},mounted() {this.exdata=exclude},
}

定义黑名单

 <keep-alive :exclude="exdata"><router-view></router-view></keep-alive>

include白名单需要缓存的组件

<keep-alive include="需要缓存的路由"><router-view></router-view></keep-alive>

keep-alive的属性

exclude黑名单，include白名单，max最大数

keep-alive的两个钩子函数

activated（组件激活时使用）与 deactivated（组件离开时调用）

与created和mounted 的区别是

created和mounted：激活只调用一次

activated：每次激活时都会调用

kepp-alive的作用?keep-alive的属性?路由元信息？白名单黑名单?keep-alive的钩子函数相关推荐

vue的生命周期钩子函数的作用
之前在大学学习Java的时候笔试题的第一道题经常是你是怎么理解生命周期的在vue的生命周期却又与Java不同的一个java类的完整的生命周期会经历加载.连接.初始化.使用.和卸载五个阶段: 而v ...
CSS-0816盒模型标准盒模型怪异盒模型及其应用背景属性补充小图标使用图标网站可变化单位meta元信息浏览器内核(渲染机制)响应式页面媒体类型媒体特性opacity和背景色设置透明的区别
title: "CSS 0816" date: 2022-08-16T11:18:25+08:00 文章目录 title: "CSS 0816" date: 2 ...
R语言使用fs包的file_info函数查看文件元信息（属性信息）、使用file_chmod函数修改文件的权限、使用file_chown函数修改文件的所有者
R语言使用fs包的file_info函数查看文件元信息(属性信息).使用file_chmod函数修改文件的权限.使用file_chown函数修改文件的所有者目录
使用Exiv2读取图像属性的详细信息
一.图像详细信息 1.在windows下,点击图像,右键属性,详细信息里面,就可以查看该图像的具体信息,如水平分辨率,分辨率,宽度,高度等,如下图: 2.这此信息对于做图像处理是很有用处的,我一直在用 ...
【android】系统属性=(属性服务,属性文件,白名单)
PropertyService(init进程) ---------------------------------------------------------------------------- ...
精通ASP.NET MVC ——属性路由
在上一篇文章中,有约定路由的介绍.MVC 5中增加了对属性路由这一新技术的支持.在属性路由中,路由是由直接运用于控制器的C#属性定义的. 启动和运用属性路由默认情况下属性路由是禁止的,通过MapMv ...
ASP.NET Web API 中的属性路由
为什么要有属性路由基于约定路由的一个优点是模板在单个位置中定义,并且路由规则在所有控制器上一致的应用.但是基于约定的路由很难支持RESTFUl 中常见的某些URI模式.例如,资源通常包含子资源,客户 ...
ASP.NET Web API 2 中的属性路由使用（转载）
转载地址:ASP.NET Web API 2 中的属性路由使用转载于:https://www.cnblogs.com/yxlblogs/p/3638625.html
eclipse-阶段五- 在[vo.BookMessageData]类型bean中找不到任何有关属性[Total]的信息
在[vo.BookMessageData]类型bean中找不到任何有关属性[Total]的信息