引言

  • vue这两条指令,在面试vue经常会被问道它们的区别,今天我也好好查看了以下文档,做做笔记。

相同点

  • 它们都用于条件渲染,都可以隐藏和显示DOM元素。

v-if

  • 通过判断条件成立与否,适当的销毁和重建元素来达到隐藏和现实元素。因此当第一次的条件为假的时候,则条件块内的元素不会被渲染。只有为真的时候才会渲染条件块的元素。

v-show

  • 也是通过判断条件的成立与否,设置display属性的值来达到隐藏和现实元素,因此无论条件为真还是为假,条件块的元素都会被渲染。

使用场景

  • 通过它们实现隐藏和现实元素的方式可以知道,元素频繁的切换使用v-show比较好,否则使用v-if比较好

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

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

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

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

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

  3. 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 ...

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

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

  5. [强连通分量] 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 ...

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

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

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

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

  8. POJ 2762 Going from u to v or from v to u? (强连通分量缩点+拓扑排序)

    题目链接:http://poj.org/problem?id=2762 题意是 有t组样例,n个点m条有向边,取任意两个点u和v,问u能不能到v 或者v能不能到u,要是可以就输出Yes,否则输出No. ...

  9. poj 2762 Going from u to v or from v to u?(强连通分量+缩点重构图+拓扑排序)

    http://poj.org/problem?id=2762 Going from u to v or from v to u? Time Limit: 2000MS   Memory Limit:  ...

  10. POJ 2762 Going from u to v or from v to u?(强联通 + TopSort)

    题目大意: 为了锻炼自己的儿子 Jiajia 和Wind 把自己的儿子带入到一个洞穴内,洞穴有n个房间,洞穴的道路是单向的. 每一次Wind 选择两个房间  x 和 y,   让他的儿子从一个房间走到 ...

随机推荐

  1. 微信支付与支付宝支付java开发注意事项

    说明:这里只涉及到微信支付和淘宝支付 以官网的接口为准,主要关注[网关].[接口].[参数][加密方式][签名][回调] 第一步,了解自己的项目要集成的支付方式 常见的有扫码支付.网页支付.APP支付 ...

  2. $loj526\ [LibreOJ\ \beta\ Round\ \#4]$ 子集 图论

    正解:图论 解题报告: 传送门$QwQ$ 发现最大团不好求,于是考虑求最大独立集.也就把所有$gcd(i,j)\cdot gcd(i+1,j+1)=1$的点之间连边,然后求最大独立集. 发现依然不可做 ...

  3. SQLServer系统函数之字符串函数

    一.字符串函数 参数character_expression:由字符数据组成的字母数字表达式,可以是常量或变量,也可以是字符列或二进制数据列 参数integer_expression:是正整数,如果 ...

  4. leetcode.310最小高度树

    对于一个具有树特征的无向图,我们可选择任何一个节点作为根.图因此可以成为树,在所有可能的树中,具有最小高度的树被称为最小高度树.给出这样的一个图,写出一个函数找到所有的最小高度树并返回他们的根节点. ...

  5. [NoSQL] 从模型关系看 Mongodb 的选择理由

    往期:Mongodb攻略 回顾 Mongodb 与关系型数据库的对应关系: MySQL   MongoDB database(数据库) database(数据库) table(表) collectio ...

  6. 单机Web后端接口服务压力测试

    单机Web后端接口服务压力测试 工具:Apache jmeter 环境:Window 10 语言:Kotlin + java 架构:SpringBoot + + Mysql + redis + Spr ...

  7. Netty--【详解】

    Netty概述:1.netty是基于Java NIO的网络应用框架,client-server框架2.Netty是一个高性能.异步事件驱动的NIO框架,它提供了对TCP.UDP和文件传输的支持,作为一 ...

  8. C# 根据链接提取div内容

    安装NuGet包    HtmlAgilityPack var wc = new WebClient(); wc.Encoding = Encoding.GetEncoding("UTF-8 ...

  9. Go和Java的性能对比,真的如此吗?

    前两天我看到了一篇文章,测试Java和Go和Python的性能,其测试内容是一个排序,排序一亿次,然后看那个语言耗时最短,我先贴一下这个文章的测试结果,Java竟然比Go快了一倍不止,Go不是号称接近 ...

  10. php5升php7代码修改整理

    1. 为什么升级至php7 a.安全需要 过早以至于不维护的php版本难免会有未修补的漏洞,安全性要求较高的行业是要及时升级的. b.性能提升(开启opcache hugepage) 据说性能提升一倍 ...