vue---条件与循环语句
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>vue--循环语句</title>
<script src="https://static.runoob.com/assets/vue/1.0.11/vue.min.js"></script>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<div id="app">
<p v-if="seen">
看下我
<template v-if="ok">
<h1>悟空</h1>
<p>
三打白骨精
</p>
{{#if ok}}
<h1>yes</h1>
{{/if}}
</template>
</p>
</div>
<!--v-else-->
<div id="else">
<!--Math.random()取随机数-->
<div v-if="Math.random()>0.5">
sorry
</div>
<div v-else>
welcome
</div>
</div>
<!--v-else-if-->
<div id="elseif">
<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>
<!--v-for 指令需要以 site in sites 形式的特殊语法，
sites 是源数据数组并且 site 是数组元素迭代的别名。-->
<div id="vfor">
<ol>
<li v-for="dog in dogs">
{{dog.name}}<br>
--------------
</li>
</ol>
<ul>
<template v-for="dog in dogs">
<li>{{ dog.name }}</li>
<li>--------------</li>
</template>
</ul>
</div>
<div id="forobj">
<ul>
<li v-for="value in object">
{{ value }}
</li>
</ul>
<ul>
<li v-for="(value,key) in object">
{{key}}:{{ value }}
</li>
</ul>
<ul>
<li v-for="(value,key,index) in object">
{{index}}: {{key}}:{{ value }}
</li>
</ul>
</div>
<div id="forint">
<ul>
<li v-for="n in 10"> {{n}}</li>
</ul>
</div>
</body>
<script>
<!--v-for 迭代对象-->
new Vue({
el:'#forint'
})
</script>
<script>
<!--v-for 迭代对象-->
new Vue({
el:'#forobj',
data:{
object:{
name:'悟空',
race:'猴子',
address:'花果山',
post:'美猴王'
}
}
})
</script>
<script>
<!--v-for -->
new Vue({
el:'#vfor',
data:{
dogs:[
{name:'泰迪'},
{name:'二哈'},
{name:'金毛'},
{name:'藏獒'},
]
}
})
</script>
<script>
<!--v-else-if-->
new Vue({
el:'#elseif',
data:{
type:'A'
}
})
</script>
<script>
<!--v-else-->
new Vue({
el:'#else',
})
</script>
<script>
new Vue({
el:'#app',
data:{
seen:true,
ok:false
}
})
</script>
</html>
vue---条件与循环语句的更多相关文章
- Python 2.7 学习笔记 条件与循环语句
本文介绍下python条件和循环语句的语法 一.if条件语句 语法格式如下: if 表达式: .... elif 表达式: .... elif 表达式: .... else: ..... 说明:与其它 ...
- Python中的条件和循环语句
条件和循环语句 1. 条件语句 if单用 格式:if 条件表达式 例如:if 5 > 3: print('True') >>> 'True' #当条件满足时才会执行上述操作. ...
- python系列八：Python3条件控制&循环语句
#!/usr/bin/python #-*-coding:gbk-*-#Python3 条件控制&循环语句import randomage = int(input("请输入你的年龄: ...
- python实例 条件和循环语句
#! /usr/bin/python #条件和循环语句 x=int(input("Please enter an integer:")) if x<0: x=0 ...
- python之最强王者（3）——变量，条件、循环语句
1.Python 变量类型 变量存储在内存中的值.这就意味着在创建变量时会在内存中开辟一个空间. 基于变量的数据类型,解释器会分配指定内存,并决定什么数据可以被存储在内存中. 因此,变量可以指定不同的 ...
- PL/SQL学习（二）条件和循环语句
原文参考:http://plsql-tutorial.com/ PLSQL条件语句 IF THEN ELSE STATEMENT 1) IF condition THEN statement ...
- r语言之条件、循环语句
if条件语句:if (conditon) {expr1} else {expr2} > x<-1> if(x==1)+ {x<-"x=1"}else+ {x ...
- #7 Python顺序、条件、循环语句
前言 上一节讲解了Python的数据类型和运算,本节将继续深入,涉及Python的语句结构,相当于Python的语法,是以后编写程序的重要基础! 一.顺序语句 顺序语句很好理解,就是按程序的顺序逻辑编 ...
- Vue.js：循环语句
ylbtech-Vue.js:循环语句 1.返回顶部 1. 循环语句 循环使用 v-for 指令. v-for 指令需要以 site in sites 形式的特殊语法, sites 是源数据数组并且 ...
- JavaScript里面的条件、循环语句以及异常处理
1.JavaScript里面条件语句主要有两种形式 if(条件){ ... }else if(条件){ ... }else{ ...} switch(变量名): case 值1://如果变量名为值1, ...
随机推荐
- Oracle 生成工作日历表
select to_char(everyDay, 'yyyy-mm-dd') as dt, to_char(everyday, 'yyyy') as yr, to_char(everyday, 'mm ...
- Apache安装，亲测成功
工作需要,为一台空白服务器安装apache,小白程序员,搞了一个下午,惭愧! 工具需要,也可以自己到apache下载 http://httpd.apache.org/download.cgi 遇到的b ...
- 第九次作业——K-means算法应用：图片压缩
一.读取一张示例图片或自己准备的图片,观察图片存放数据特点. 根据图片的分辨率,可适当降低分辨率. 再用k均值聚类算法,将图片中所有的颜色值做聚类. 然后用聚类中心的颜色代替原来的颜色值. 形成新的图 ...
- 【SoftwareTesting】Lab 2
一. 在火狐浏览器上安装selenium插件 点击“开发者”的选项,然后点击“获取更多工具”,输入seleniumIDE进行搜索,找到后进行安装即可.安装完成后火狐浏览器的右上角会多出一个小的带 ...
- U盘安装kali中CDROM问题解决
1,采用ultraISO 制作Kali的安装盘,无法安装.U盘不能被识别. 2,改用win32diskimager,能识别了,但期间出现CDROM找不到. 3,采用网上方式,ALT+ F2,ls /d ...
- LIMIT用法
select * from employees order by hire_date DESC LIMIT 0,3; 直接给语句说明:根据hire_date 降序排列,LIMIT 第一个参数表示从第几 ...
- 关于MySQL什么时候使用索引问题以及什么情况下应不建或少建索引
一,什么情况下使用索引1. 表的主关键字 自动建立唯一索引 2. 表的字段唯一约束 ORACLE利用索引来保证数据的完整性 3. 直接条件查询的字段 在SQL中用于条件约束的字段 如zl_yhjbqk ...
- c# 连接数据库SqlHelper
using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...
- 微信小程序 数据库指引 前端操纵数据库失败
把注释解开后,点击添加显示失败了 看了下注解,发现是数据库权限问题, 修改一下成第一个,然后点击又失败了,多点击几下,就会成功! 哦 别忘了时刻 ctrl +s 保存,如果你习惯了idea 自动保存的 ...
- SSRF漏洞浅析
大部分web应用都提供了从其他的服务器上获取数据的功能,如使用用户指定的URL,web应用可以获取图片,下载文件,读取文件内容等.如果服务端提供了从其他服务器应用获取数据的功能且没有对目标地址做过滤与 ...