当前位置: 首页 > news >正文

VUE——v-once指令

v-once指令

仅渲染元素和组件一次,并跳过之后的更新。

官网介绍

v-once用法:

<!-- 单个元素 -->
<span v-once>This will never change: {{msg}}</span>
<!-- 带有子元素的元素 -->
<div v-once><h1>comment</h1><p>{{msg}}</p>
</div>
<!-- 组件 -->
<MyComponent v-once :comment="msg" />
<!-- `v-for` 指令 -->
<ul><li v-for="i in list" v-once>{{i}}</li>
</ul>

例子:

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><div id="onceApp"><button @click="changeOnce()">改变aboutOnce值</button><div v-once>{{aboutOnce}}</div></div><script src="./vue.js"></script><script>new Vue({el: '#onceApp',data: {aboutOnce: '关于v-once的用法',changeOnce() {this.aboutOnce = "改变了"}},})</script>
</body></html>

相关文章:

  • 一些硬件知识(六)
  • 24/03/07总结
  • 清除Mac OS上Xcode占用的空间
  • 第一次捡垃圾
  • 自然语言处理 | 语言模型(LM) 浅析
  • RPC——远程过程调用
  • 蓝桥杯-排序
  • Ajax (1)
  • 即插即用篇 | YOLOv8 引入 NAM 注意力机制 | 《NAM: Normalization-based Attention Module》
  • Kubernetes Operator开发实践
  • ROS2学习(七) Foxy版本ros2替换中间件。
  • php调用guzzlehttp库时出现Segmentation fault的解决方案
  • [密码学]Base64编码
  • 【Kaggle】练习赛《肥胖风险的多类别预测》
  • 【java web】【瑞吉外卖javaweb】踩坑贴不断更新中...
  • AzureCon上微软宣布了哪些容器相关的重磅消息
  • JavaScript函数式编程(一)
  • JSONP原理
  • magento2项目上线注意事项
  • Mysql数据库的条件查询语句
  • passportjs 源码分析
  • React Native移动开发实战-3-实现页面间的数据传递
  • Redis字符串类型内部编码剖析
  • RxJS: 简单入门
  • TCP拥塞控制
  • underscore源码剖析之整体架构
  • 案例分享〡三拾众筹持续交付开发流程支撑创新业务
  • 基于Javascript, Springboot的管理系统报表查询页面代码设计
  • 记一次和乔布斯合作最难忘的经历
  • 面试遇到的一些题
  • 如何胜任知名企业的商业数据分析师?
  • 实现简单的正则表达式引擎
  • 应用生命周期终极 DevOps 工具包
  • 用Python写一份独特的元宵节祝福
  • 找一份好的前端工作,起点很重要
  • !!java web学习笔记(一到五)
  • ## 临床数据 两两比较 加显著性boxplot加显著性
  • $.ajax()
  • (1/2)敏捷实践指南 Agile Practice Guide ([美] Project Management institute 著)
  • (附源码)spring boot公选课在线选课系统 毕业设计 142011
  • (附源码)ssm教材管理系统 毕业设计 011229
  • (蓝桥杯每日一题)love
  • (十八)用JAVA编写MP3解码器——迷你播放器
  • (十一)JAVA springboot ssm b2b2c多用户商城系统源码:服务网关Zuul高级篇
  • (淘宝无限适配)手机端rem布局详解(转载非原创)
  • (原創) 如何將struct塞進vector? (C/C++) (STL)
  • .NET MVC之AOP
  • .NET/C# 使窗口永不获得焦点
  • .netcore 6.0/7.0项目迁移至.netcore 8.0 注意事项
  • .Net接口调试与案例
  • @Repository 注解
  • @staticmethod和@classmethod的作用与区别
  • [BUUCTF 2018]Online Tool
  • [C#基础知识系列]专题十七:深入理解动态类型
  • [C/C++]数据结构 栈和队列()