引言

  • 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的package和import机制

    在说package.import机制前我们先来了解下java的CLASSPATH. CLASSPATH顾名思义就是class的路径,当我们在系统中运行某个java程序时,它就会告诉系统在这些地方寻找这 ...

  2. Python 元类的基本介绍及使用

    一.什么是元类 二.如何使用元类 (一)不依赖class关键字创建一个自定义类 (二)自定义元类控制类的产生 (三)自定义元类控制类的调用 一.什么是元类 在python中,一切皆对象,而对象都是由类 ...

  3. $HDU1846\ Brave\ Game$ 博弈论

    正解:博弈论 解题报告: 传送门! 巴什博奕板子题鸭$QwQ$ 就有个结论,是说当$(m+1)\mid n$时先手必败,否则必胜 这个瞎证明一下就能出来 就考虑当$(m+1)\mid 1$时,若先手取 ...

  4. Asp.net Core Session 存储任意对象

    using Microsoft.AspNetCore.Http; using Newtonsoft.Json; public static class SessionExtensions { publ ...

  5. ElementUi 两个表格反选

    ElementUi 两个表格反选 1.先看看实现的图 表格内容显示 <el-row :gutter="20"> <el-col :span="16&qu ...

  6. shiro整合springmvc

    说明   代码及部分相关资料根据慕课网Mark老师的视频进行整理   其他资料: shiro官网 流程 配置 1) 配置web.xml整合shiro 把shiro整合到springMVC实质上是在we ...

  7. KMP 和 扩展KMP

    KMP:在主串S中找子串T的位置KMP算法的时间复杂度O(|S|+|T|). #define maxn 1000 char s[maxn],t[maxn];//s为主串,t为子串 int net[ma ...

  8. 全流程开发 TP6.0实战高并发电商服务系统*完

    在TP6框架中我们可以学到TP整体知识,如下图一所示: 图一:TP6整体知识点 这些内容都会在实战课程中一一涵盖,并且在课程中我们会用到五层架构思想(如图二),和传统的MVC架构有所不一样,这样做可以 ...

  9. ASP.Net MVC 引用动态 js 脚本

    希望可以动态生成 js  发送给客户端使用. layout页引用: <script type="text/javascript" src="@Url.Action( ...

  10. cogs 3. 服务点设置 dijkstra

    3. 服务点设置 ★   输入文件:djsa.in   输出文件:djsa.out   简单对比时间限制:1 s   内存限制:128 MB [问题描述] 为了进一步普及九年义务教育,政府要在某乡镇建 ...