VueJS条件语句：v-if、v-else、v-else-if
HTML:if-else
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue 测试实例 - 菜鸟教程(runoob.com)</title>
<script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<div id="app">
<div v-if="Math.random() > 0.5">
Sorry
</div>
<div v-else>
Not sorry
</div>
</div> <script>
new Vue({
el: '#app'
})
</script>
</body>
</html>
HTML:if-else if-else
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue 测试实例 - 菜鸟教程(runoob.com)</title>
<script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<div id="app">
<div v-if="type === 'A'">
A
</div>
<div v-else-if="type === 'B'">
B
</div>
<div v-else-if="type === 'C'">
C
</div>
<div v-else>
Not A/B/C
</div>
</div> <script>
new Vue({
el: '#app',
data: {
type: 'C'
}
})
</script>
</body>
</html>
v-show
我们也可以使用 v-show 指令来根据条件展示元素：
<h1 v-show="ok">Hello!</h1>
VueJS条件语句：v-if、v-else、v-else-if的更多相关文章
- Mybatis-Plus的Service方法使用 之 泛型方法default ＜V＞ List＜V＞ listObjs(Function＜? super Object, V＞ mapper)
首先 我们先看到的这个方法入参是:Function<? super Object , V> mapper ,这是jdk1.8为了统一简化书写格式引进的函数式接口 . 简单 解释一下我对Fu ...
- C++：vector中的v.at(0)和v[0]的区别
设v是一个vector的对象, 如果v是非空的,则v.at(0)和v[0]是没有区别的,都是取数组中第一个值: 如果v是空的,则v.at(0)会抛出异常(exception std::out_of_r ...
- 证明 U and V={0}时 dim(U+V)=dim(U)+dim(V)
U And V={0} 证明 dim(U+V)=dim(U)+dim(V)设{u1,u2,...,uk} 是U的基,{v1,v2...,vr}是V的基,dim(U)=k ,dim(V)=r dim(U ...
- CF F - Tree with Maximum Cost (树形DP)给出你一颗带点权的树，dist(i, j)的值为节点i到j的距离乘上节点j的权值，让你任意找一个节点v，使得dist(v, i) (1 < i < n)的和最大。输出最大的值。
题目意思: 给出你一颗带点权的树,dist(i, j)的值为节点i到j的距离乘上节点j的权值,让你任意找一个节点v,使得dist(v, i) (1 < i < n)的和最大.输出最大的值. ...
- python代码{v: k for k, v in myArray.items()}是什么意思？
最近在扒vnpy的源码总能看到{v: k for k, v in ORDERTYPE_VT2HUOBI.items()}这样的源码,就是不知道什么意思 然后万能的google找到了Quora的一个类似 ...
- go语言的条件语句和循环语句
一,条件语句 常见的就是if语句: 单支条件语句: if 条件 :执行语句 (注,如果是没有逻辑运算符连接的话,是可以不需要括号的,也可以加上括号,如:if (条件):执行语句) 双支 ...
- Shell 学习笔记之条件语句
条件语句 if # if if condition then command fi # if else if condition then command else command fi # if e ...
- [译]javascript中的条件语句
本文翻译youtube上的up主kudvenkat的javascript tutorial播放单 源地址在此: https://www.youtube.com/watch?v=PMsVM7rjupU& ...
- 【python基础语法】运算符&if条件语句&while循环&for循环（第5天课堂笔记）
""" if语法规则: if 条件比较语句1: # 条件成立的时候 会执行的代码 elif 条件比较语句2: # 条件2成立的时候 会执行的代码 else: # 条件不成 ...
随机推荐
- [canvas入坑1]canvas 画布拖拽效果
查看效果请到 http://philippica.github.io/ 点击drag 和上一篇画图很像,所以有些部分做了省略 当鼠标按下时保存当前画布上的内容到ppImgData中,并且记录下初始点 ...
- gcc编译生成静态及动态链接库步骤
gcc编译生成静态及动态链接库步骤 这两天在看<Linux C程序设计大全>,吴岳编著,清华大学出版社.这本书是在一个培训机构看到的,在网上查了下该书的相关信息.从目录而言,该书涵盖了Li ...
- modulus CRT
(吐槽)额..CRT本来就是modulus的么.. CRT是可以每次加一个条件的(当然要保证coprime) 那么我们考虑 x=a (mod p1) x=b (mod p2) 这样的话我们知道 x=a ...
- Python之时间：datetime模块
datetime在time基础之上封装了一些方法.但是time是经常使用的,datetime中的功能,time都能实现 一.datetime的三个模块 datetime.date datetime.t ...
- 洛谷 [P3381] 最小费用最大流模版
#include <iostream> #include <cstdio> #include <cstring> #include <cmath> #i ...
- 洛谷P1965 转圈游戏 [NOIP2013]
题目描述 n 个小伙伴(编号从 0 到 n-1)围坐一圈玩游戏.按照顺时针方向给 n 个位置编号,从0 到 n-1.最初,第 0 号小伙伴在第 0 号位置,第 1 号小伙伴在第 1 号位置,……,依此 ...
- 【CF1043C】Smallest Word（构造）
题意:给定一个由a和b构成的字符串,可以选择翻转或不翻转他的每个前缀,翻转记为1不翻转记为0,求能将字符串排序的字典序最小的操作序列 n<=1e3 思路:考虑极长的一段a [t,w] 翻转t-1 ...
- 本机开发Native Development：Invalid path for NDK （转）
打开window菜单下的preference选项.选择Android,Native Development(本地开发) 选择你的NDK安装目录.但是,这个插件目前仅支持ndk的r4和r5版本,更高版本 ...
- Python_代码练习_写一个判断是否为小数的函数
这两天在学习函数,练习写一个判断是否为小数的函数,看起来蛮简单的,飞速写完很是得意,然后测了一下,发现差得好多呀,这个并不像想象那样简单,我得到的教训是,想要把一个需求哪怕再小的需求考虑周全,都不是件 ...
- 洛谷 P1328 生活大爆炸版石头剪刀布【模拟/环/周期】
题目描述 石头剪刀布是常见的猜拳游戏:石头胜剪刀,剪刀胜布,布胜石头.如果两个人出拳一样,则不分胜负.在<生活大爆炸>第二季第8 集中出现了一种石头剪刀布的升级版游戏. 升级版游戏在传统的 ...