vue3使用keep-alive做缓存

暂未整理,等待更新

文章目录

  • 一、注意项
    • 1.不生效原因
  • 二、使用步骤
    • 1.引入库
    • 2.读入数据
  • 总结

一、注意项

1.不生效原因

  • vue3无beforeRouteEnter,但可以写。<script lang="jsx">需要一致
  • :include="[‘experienceMaintenance’, ‘realTimeAlarm’]"使用的vue页name,不是路由的name
  • 需要使用:key=区分 否则换错报错
  • 在路由文件里面,将需要keep-alive的页面放在layout组件的children里面(如果不放在children里面keep-alive就不会生效)—layout组件就是你写keep-alive的那个组件
  {{$route.meta}}-{{$route.meta.keepAlive}}<router-view v-slot="{ Component }"><keep-alive><component v-if="$route.meta.keepAlive" :key="$route.path" :is="Component" /></keep-alive><component v-if="!$route.meta.keepAlive" :key="$route.path" :is="Component" /></router-view>
  <router-view v-slot="{ Component }"><keep-alive :include="['experienceMaintenance', 'realTimeAlarm']"><component :is="Component"></component></keep-alive></router-view>

二、使用步骤

1.引入库

代码如下(示例):

2.读入数据

总结

提示:这里对文章进行总结:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/63689.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Android13应用在后台录音无声音

最近在做项目&#xff0c;对讲应用放在后台&#xff0c;录音无声音&#xff0c;最后解决。 一 现象 对讲应用运行在后台&#xff0c;录音无效查看日志&#xff0c;AudioRecorder录音回调全是0&#xff1b;状态栏无通知&#xff0c;无申请通知权限。 二解决 看了现象应该能够…

数据结构6.3--交换排序

目录 交换排序基本思想 1.冒泡排序 2.快速排序 2.1hoare版本 2.2挖坑法 2.3前后指针版本 交换排序基本思想 所谓交换&#xff0c;就是根据序列中两个记录键值的比较结果来对换这两个记录在序列中的位置&#xff0c;交换排序的特点是&#xff1a;将键值较大的记录向序列的尾…

Unity 制作一个视频播放器(打包后,可在外部编辑并放置新的视频)

效果展示&#xff1a; 在这里&#xff0c;我把视频名称&#xff08;Json&#xff09;和对应的视频资源都放在了StreamingAssets文件夹下&#xff0c;以便于打包后&#xff0c;客户还可以自己在外部增加、删除、修改对应的视频资料。 如有需要&#xff0c;请联细抠抠。

软件工程知识点

软件开发模型1 软件开发模型2 软件过程模型习惯上也称为软件开发模型&#xff0c;它是软件开发全部过程、活动和任务的结构框典型的软件过程模型有瀑布模型、增量模型、演化模型(原型模型、螺旋模型)、喷泉模型基于构件的开发模型和形式化方法模型等。 极限编程 开发方法 RUP…

Apache Echarts和POI

目录 Apache ECharts 介绍 入门 绘制一个简单的图表 Apache POI 介绍 通过POI创建Excel文件并且写入文件内容 通过POI读取Excel文件中的内容 导出Excel表格 Apache ECharts 介绍 Apache ECharts 是一款基于 Javascript 的数据可视化图表库&#xff0c;提供直观&#xf…

LeetCode 1844将所有数字用字符替换

题目&#xff1a; 给你一个下标从 0 开始的字符串 s &#xff0c;它的 偶数 下标处为小写英文字母&#xff0c;奇数 下标处为数字。 定义一个函数 shift(c, x) &#xff0c;其中 c 是一个字符且 x 是一个数字&#xff0c;函数返回字母表中 c 后面第 x 个字符。 运行代码&…

COLA学习之环境搭建(三)

小伙伴们&#xff0c;你们好&#xff0c;我是老寇&#xff0c;上一节&#xff0c;我们学习了COLA代码规范&#xff0c;继续跟老寇学习COLA环境搭建 首先&#xff0c;打开GitHub&#xff0c;搜索 COLA 请给这个COLA项目点个Star&#xff0c;养成好习惯&#xff0c;然后Fork到自…

c++ CMakeLists.txt详解

基本结构 CMake 最低版本声明 用于指定需要的最低 CMake 版本&#xff0c;确保兼容性。 cmake_minimum_required(VERSION 3.10)指定 CMake 的最低版本。确保用户的 CMake 版本符合项目需求&#xff0c;否则报错。版本选择建议根据项目使用的功能决定。例如&#xff0c;3.10 引…

【友加畅捷】软件保存/激活云加密/授权码的时候失败。

【问题现象】 畅捷通T1飞跃专业版&#xff0c;在保存云加密的时候提示&#xff1a; 获取加密失败&#xff0c;请检查数据库是否正确连接。 【解决方法】 服务器目录FYDogServer.ini文件&#xff0c;将DogCloud0改成DogCloud1&#xff0c; 然后重新保存。 【问题现象】 U通用…

单链表(数组模拟)

单链表的结构 用数组来模拟的话&#xff0c;需要两个数组&#xff0c;通过下标关联起来 例如&#xff1a; #include <bits/stdc.h>using namespace std;const int N 100010;int e[N]; //储存第i个插入的数的值 int ne[N]; //储存下标为i的next指针 int n; int idx1; int…

docker compose容器编排工具

华子目录 docker compose概述主要功能工作原理docker compose中的管理层docker compose的常用命令参数构建和重新构建服务docker compose的yaml文件一、服务&#xff08;services&#xff09;二、数据卷&#xff08;volumes&#xff09;三、网络&#xff08;networks&#xff0…

科普时刻 | 无线充电热管理:挑战与解决方案

无线充电器可通过电磁感应&#xff0c;在不直接进行电接触的情况下执行电能传输&#xff0c;因此无需繁杂的电缆电线连接&#xff0c;便可为我们的手机、手表、平板电脑以及耳机等设备供电。然而&#xff0c;随着对电子设备更快充电的需求不断增加&#xff0c;热管理对于防止过…

用ChatGPT-o1进行论文内容润色效果怎么样?

目录 1.引导问题发现 2.角色设定 3.整理常问修改 4.提供样例 5.小细节 小编在这篇文章中分享如何充分利用ChatGPT-o1-preview来提升论文润色的技巧。小编将持续跟进最新资源和最新的调研尝试结果&#xff0c;为宝子们补充更多实用的写作技巧。这些技巧将有助于您更有效地利…

数据可视化大屏UI组件库:B端科技感素材PSD

在数据可视化领域&#xff0c;一个出色的大屏UI设计不仅能够准确传达数据背后的信息&#xff0c;更能提升用户的视觉体验。然而&#xff0c;对于UI设计师而言&#xff0c;设计这样一款界面往往面临着寻找合适设计素材的挑战。为了应对这一难题&#xff0c;我们推出了这款数据可…

使用elasticsearch-java客户端API生成DSL语句

在Elasticsearch7.15.0之后&#xff0c;官方提供了elasticsearch-java包作为java客户端工具包&#xff0c;用于取代elasticsearch-rest-high-level-client&#xff0c;其底层依然依赖Elasticsearch Low Level REST 客户端&#xff0c;即elasticsearch-rest-client。 elasticsea…

Python OpenCV按照像素点图片切割

图像分割是从图像处理到图像分析的关键步骤&#xff0c;在目标检测、特征提取、图像识别等领域具有广泛应用。OpenCV是一个强大的计算机视觉库&#xff0c;提供了多种图像分割方法。本文将详细介绍如何使用Python和OpenCV进行基于像素点的图像分割&#xff0c;包括阈值分割、自…

selenium:新窗口切换、关闭

背景 当前页面A&#xff0c;点击跳转到页面B 句柄就是你点击一个页面,跳转了一个新的窗口。你要操作的元素可能在原窗口上,也有可能在新窗口上。 通过索引定位 window_handles driver.window_handlesdriver.switch_to.window(window_handles[1])#定位到第二个通过当前页面的…

Kubernetes和ZStack分配CPU的机制

在 Kubernetes (k8s) 环境中限制 CPU 资源与在 ZStack 虚拟机中分配 CPU 资源的机制存在一些关键差异。以下是这两种环境下 CPU 分配机制的详细对比&#xff1a; Kubernetes 中的 CPU 管理 资源请求与限制&#xff1a;Kubernetes 允许你为每个容器指定 CPU 请求&#xff08;re…

深度学习中的损失函数

损失函数是深度学习模型训练过程中不可或缺的一部分&#xff0c;是模型预测值与真实值之间差异的客观衡量标准。它们是模型训练的基础&#xff0c;指导算法调整模型参数&#xff0c;以最小化损失并提高预测准确性。它们衡量了模型预测值与真实值的吻合程度。通过最小化这种损失…

#自定义数据类型-简单模拟进程执行

#include <iostream> #include <string> #include <iomanip> using namespace std;//定义一个名为process的结构体&#xff0c;用于表示进程相关信息 //包含进程名、进程ID、进程优先级、进程状态、进程所需CPU时间、进程描述等成员 struct process {string …