区别

  • 1.手段:v-if是通过控制dom节点的存在与否来控制元素的显隐;v-show是通过设置DOM元素的display样式,block为显示,none为隐藏;
  • 2.编译过程:v-if切换有一个局部编译/卸载的过程,切换过程中合适地销毁和重建内部的事件监听和子组件;v-show只是简单的基于css切换;
  • 3.编译条件:v-if是惰性的,如果初始条件为假,则什么也不做;只有在条件第一次变为真时才开始局部编译(编译被缓存?编译被缓存后,然后再切换的时候进行局部卸载); v-show是在任何条件下(首次条件是否为真)都被编译,然后被缓存,而且DOM元素保留;
  • 4.性能消耗:v-if有更高的切换消耗;v-show有更高的初始渲染消耗;

使用场景

  基于以上区别,因此,如果需要非常频繁地切换,则使用 v-show 较好;如果在运行时条件很少改变,则使用 v-if 较好。

总结

  v-if判断是否加载,可以减轻服务器的压力,在需要时加载,但有更高的切换开销;v-show调整DOM元素的CSS的dispaly属性,可以使客户端操作更加流畅,但有更高的初始渲染开销。如果需要非常频繁地切换,则使用 v-show 较好;如果在运行时条件很少改变,则使用 v-if 较好。

v-if和v-show 的区别的更多相关文章

  1. FFmpeg笔记--vcodec和-c:v,-acodec和-c:a的区别?

    在看ffmpeg命令的时候经常会看到有些地方使用--vcodec指定视频解码器,而有些地方使用-c:v指定视频解码器,那这两个有没有区别呢? ffmpeg的官方文档: -vcodec codec (o ...

  2. 转:oracle几组重要的常见视图-v$latch,v$latch_children,v$lock,v$locked_object

    v$latch Oracle Rdbms应用了各种不同类型的锁定机制,latch即是其中的一种.Latch是用于保护SGA区中共享数据结构的一种串行化锁定机制.Latch的实现是与操作系统相关的, 尤 ...

  3. oracle 入门笔记--v$sql和v$sqlarea视图(转载)

    转载于作者:dbtan 原文链接:http://www.dbtan.com/2009/12/vsql-and-vsqlarea-view.html v$sql和v$sqlarea视图: 上文提到,v$ ...

  4. Oracle基本数据字典:v$database、v$instance、v$version、dba_objects

    v$database: 视图结构: SQL> desc v$database; Name                                      Null?    Type - ...

  5. POJ2762 Going from u to v or from v to u(单连通 缩点)

    判断图是否单连通,先用强连通分图处理,再拓扑排序,需注意: 符合要求的不一定是链拓扑排序列结果唯一,即在队列中的元素始终只有一个 #include<cstdio> #include< ...

  6. Going from u to v or from v to u?_POJ2762强连通+并查集缩点+拓扑排序

         Going from u to v or from v to u? Time Limit: 2000MS   Memory Limit: 65536K       Description I ...

  7. 临时文件相关的v$tempfile v$sort_usage与V$tempseg_usage

    SQL> select username,user,segtype,segfile#,segblk#,extents,segrfno# from v$sort_usage; SEGFILE#代表 ...

  8. [强连通分量] POJ 2762 Going from u to v or from v to u?

    Going from u to v or from v to u? Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 17089 ...

  9. POJ2762 Going from u to v or from v to u?(判定单连通图:强连通分量+缩点+拓扑排序)

    这道题要判断一张有向图是否是单连通图,即图中是否任意两点u和v都存在u到v或v到u的路径. 方法是,找出图中所有强连通分量,强连通分量上的点肯定也是满足单连通性的,然后对强连通分量进行缩点,缩点后就变 ...

  10. poj 2762 Going from u to v or from v to u?

    题目描述:为了让他们的儿子变得更勇敢些,Jiajia和Wind将他们带到一个大洞穴中.洞穴中有n个房间,有一些单向的通道连接某些房间.每次,Wind选择两个房间x和y,要求他们的一个儿子从一个房间走到 ...

随机推荐

  1. Win32窗口消息机制 x Android消息机制 x 异步执行

    如果你开发过Win32窗口程序,那么当你看到android代码到处都有的mHandler.sendEmptyMessage和 private final Handler mHandler = new ...

  2. HashMap的源码学习以及性能分析

    HashMap的源码学习以及性能分析 一).Map接口的实现类 HashTable.HashMap.LinkedHashMap.TreeMap 二).HashMap和HashTable的区别 1).H ...

  3. CentOS7中安装MariaDB

    什么是mariaDB? 在线安装(慢的要命) RPM离线安装(CentOS7.X) 在线安装 打开官方网站 https://mariadb.org/ 点击Download,跳转到下一页面 继续点击Do ...

  4. [UWP]UIElement.Clip虽然残废,但它还可以这样玩

    1. 复习一下WPF的UIElement.Clip 用了很久很久的WPF,但几乎没有主动用过它的Clip属性,我只记得它很灵活,可以裁剪出多种形状.在官方文档复习了一下,大致用法和效果如下: < ...

  5. jqery 动态添加元素 绑定事件

    jQuery动态添加元素: var url = "...";//服务地址 $.ajax({ type: 'post', url: url, data:{fireId:fireId} ...

  6. 【JavaEE】之MyBatis输出映射

    MyBatis中的输出映射有两种:resultType和resultMap. 1.resultType 使用resultType进行结果映射时,只有当查询结果中有至少一列的名称和resultType指 ...

  7. Zookeeper 应用实现-配置中心

    一.目标 一个乞丐版自更新配置中心,更新配置后,能在各个服务器实现更新 二.架构 三.角色 config-web: 配置后台,主要用于管理配置,增改配置 config-agent: 监听配置,遇到变动 ...

  8. lvm讲解、磁盘故障小案例

    第4周第3次课(4月11日) 课程内容: 4.10/4.11/4.12 lvm讲解4.13 磁盘故障小案例 4.10/4.11/4.12 lvm讲解 lvm可以给磁盘扩容和缩容,结构图如下. 首先创建 ...

  9. 【JZOJ2019.10.07】模拟赛C组

    \(T1\) 题目描述&大意 贝西牛在每个点左右撞来撞去,不能出去 的情况下能活动(达到)的空间总共有多少? 思路 部分过程为: 反正就是能撞的撞 代码:

  10. Flask开发天气查询软件,带你掌握pipenv的使用与手机Termux下的部署

    关于pipenv 昨天介绍了pipenv这个相比于virtualenv更高端大气上档次的虚拟环境管理软件,但看了下流量貌似不是很受欢迎,也许是我介绍的不够好吧.那么今天就拿它做一个例子,开发一款天气预 ...