vue 使用keep-alive 让返回页面不重新刷新(页面缓存)(保持组件状态)

news/2024/7/19 15:49:02 标签: vue.js, js, 前端, javascript

官方说明

vue keep-alive 官方说明

示例

1.在路由配置页添加meta信息

javascript"> {
   path: '/XXXXXXX',
   component: XXXXXX,
   meta:{
     keepAlive:true //需要缓存的页面
   }
},

2.在app.vue 中使用keep-alive包裹需要缓存页面的视图组件

在keep-alive包裹外展示不需要缓存的视图组件

javascript">
<keep-alive>
  //keep-alive里包裹需要缓存的视图组件
   <router-view v-if="$route.meta.keepAlive" />
</keep-alive>
//在keep-alive包裹外展示不需要缓存的视图组件
<router-view v-if="!$route.meta.keepAlive"></router-view>


http://www.niftyadmin.cn/n/874894.html

相关文章

小程序跳转另一个小程序并携带参数

小程序官方文档wx.navigateToMiniProgram api地址(打开另一个小程序) 跳转小程序的代码 let token "xxxxxxxxxx" wx.navigateToMiniProgram({appId: XXXX , //被跳转小程序的appIDpath: "XXX/XXX/XXX?tokentoken&typepath" // 被跳转小程序的目标…

小程序vue 发送验证码后冷却功能

vue <button class"getCode" :disabled"isBtnDisable" click"getCode">{{ codeText }}</button>// 组件数据data() {return {codeText: 获取验证码,isBtnDisable: false}},// 组件方法methods: {// 发送验证码getCode() {let i 60…

室内施工图LiSP_有点CAD绘图基础的,可以自学室内设计么?

不请自来~自学是选择的学习方式&#xff0c;其实和你到底有没有基础是没有关系的呢但是我个人建议&#xff0c;面对专业要求这么高的一个行业还是系统的学习学习对个人发展更好些的吧先给你分析一下室内设计未来的发展你就明白了自学可行么&#xff1a;现在总能听到各种呼声&am…

vue 中使用节流和防抖(触发事件中watch中使用)

Tools.js /** fun [function] 需要防抖的函数* delay [number] 毫秒&#xff0c;防抖期限值*/ export function debounce(fun, delay 300) {let timer;return function () {let ctx thislet args argumentsif (timer) {clearTimeout(timer)}timer setTimeout(() > {tim…

华为手机主页面显示一半_华为底部导航栏遮挡布局界面的显示问题

PopupWindow rolePopnew PopupWindow();rolePop.setContentView(popView);rolePop.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);//获取屏幕高度DisplayMetricsdisplaymetrics getResources().getDisplayMetrics();intScreenHeightdisplaymetrics.heightPixels;//获取状态栏…

html2canvas 生成图片并将图片上传为网络链接

安装依赖 npm install html2canvas引入依赖 import html2canvas from html2canvas// 上传图片videoFile(file) {let params new window.FormData()let fileOfBlob new File([file], new Date().getTime() .jpg)params.append(file, fileOfBlob)uploadImgFile( params).the…

error 系统错误 错误码10007_云台壹号剖析金融科技中机器学习模型的错误率

原标题&#xff1a;云台壹号剖析金融科技中机器学习模型的错误率云台壹号认为&#xff0c;为了评估机器模型是否存在过度拟合&#xff0c;可以计算两个指标&#xff0c;样本内错误率(in sample errors)&#xff0c;与样本外错误率(out of sample errors)。其中&#xff0c;错误…

velocity参数重新赋值_Velocity 基本语法

Velocity 基本语法Velocity 是一个基于 Java 的模板引擎框架&#xff0c;提供的模板语言可以使用在 Java 中定义的对象和变量上。Velocity 是 Apache 基金会的项目&#xff0c;开发的目标是分离 MVC 模式中的持久化层和业务层。但是在实际应用过程中&#xff0c;Velocity 不仅仅…