（5）打鸡儿教你Vue.js
条件与循环
条件判断使用 v-if 指令
<p v-if="seen">
<template v-if="ok">
<script>
new Vue({
el: '#app',
data: {
seen: true,
ok: true
}
})
</script>
<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>
<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>
v-show 指令来根据条件展示元素：
<body>
<div id="app">
<h1 v-show="ok">Hello!</h1>
</div>
<script>
new Vue({
el: '#app',
data: {
ok: true
}
})
</script>
</body>
请点赞！因为你的鼓励是我写作的最大动力！
吹逼交流群：711613774
（5）打鸡儿教你Vue.js的更多相关文章
- （29）打鸡儿教你Vue.js
web阅读器开发 epub格式的解析原理 Vue.js+epub.js实现一个简单的阅读器 实现阅读器的基础功能 字号选择,背景颜色 有上一页,下一页的功能 设置字号,切换主题,进度按钮 电子书目录 ...
- （26）打鸡儿教你Vue.js
weex框架的使用 1.weex开发入门 2.weex开发环境搭建 3.掌握部分weex组件模块 4.了解一些vue基本常见语法 5.制作一个接近原生应用体验的app weex介绍 安装开发环境 We ...
- （22）打鸡儿教你Vue.js
vue.js 单页面,多页面 Vue cli工具 复杂单页面应用Vue cli工具 交互设计,逻辑设计,接口设计 代码实现,线上测试 git clone,git int 创建分支,推送分支,合并分支 ...
- （21）打鸡儿教你Vue.js
组件化思想: 组件化实现功能模块的复用 高执行效率 开发单页面复杂应用 组件状态管理(vuex) 多组件的混合使用 vue-router 代码规范 vue-router <template> ...
- （19）打鸡儿教你Vue.js
了解vue2.x的核心技术 建立前端组件化的思想 常用的vue语法 vue-router,vuex,vue-cli 使用vue-cli工具 Vue框架常用知识点 vue核心技术 集成Vue 重点看,重 ...
- （18）打鸡儿教你Vue.js
介绍一下怎么安装Vue.js vue.js Vue 不支持 IE8 及以下版本,因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性. Vue.js是一个渐进的,可逐步采用的Jav ...
- （17）打鸡儿教你Vue.js
vue-router <a class="list-group-item" v-link="{ path: '/home'}">Home</a ...
- （15）打鸡儿教你Vue.js
组件化vue.js 组件单向绑定 组件双向绑定 组件单次绑定 创建组件构造器 注册组件 使用组件 Vue.extend() Vue.component() 使用组件 <div id=" ...
- （13）打鸡儿教你Vue.js
一小时复习 vue.js是一个JavaScriptmvvm库,是以数据驱动和组件化的思想构建的,相比angular.js,vue.js提供了更加简洁,更加容易理解的api,如果习惯了jquery操作d ...
- （12）打鸡儿教你Vue.js
组件 语法格式如下: Vue.component(tagName, options) <tagName></tagName> <div id="app" ...
随机推荐
- Authentication源码解析
1.获取当前的 Subject. 调用 SecurityUtils.getSubject(); 从当前线程的threadLocals属性中获取Subject对象 SecurityUtils publi ...
- CentOS 7忘记了root密码解决方案
1.启动系统,在选择进入系统的界面按“e”进入编辑页面 2.按向下键,找到以“Linux16”开头的行,在该行的最后面输入“init=/bin/sh” 3.按“ctrl+X”组合键进入单用户模式 4 ...
- 解决 VUE项目过大nodejs内存溢出问题
今天在启动vue项目的时候报了这样一个错误, 如图所示:频繁出现此种情况,项目太大,导致内存溢出,排除代码问题外,可参照以下方式解决 // 全局安装increase-memory-limit npm ...
- sql server动态分页
USE RYPlatformManagerDB GO SET ANSI_NULLS, QUOTED_IDENTIFIER ON GO CREATE Proc [dbo].[WEB_PageView] ...
- 理解JVM之类加载机制
类完整的生命周期包括加载,验证,准备,解析,初始化,使用,卸载,七个阶段.其中验证,准备,解析统称为连接,类的卸载在前面的关于垃圾回收的博文中已经介绍. 加载,验证,准备,初始化,卸载这五个阶段的顺序 ...
- Apache基于域名、端口、IP的虚拟主机配置（Centos 6.5）
虚拟主机:部署多个站点,每个站点,希望用不同的域名和站点目录,或者是不同的端口,不同的ip,需要虚拟主机功能.一句话,一个http服务要配置多个站点,就需要虚拟主机. 虚拟主机分类:基于域名.基于端口 ...
- C# - 常见问题整理
关于循环和try{}..catch{}的嵌套使用 foreach(var item in items) { try { try{ } catch(Exception ex) { throw; // 将 ...
- 【DRF框架】序列化组件——ModelSerializer
ModelSerializer 1.ModelSerializer类似于ModelForm 2.根据模型自动生成一组字段 3.自带实现了.update()以及.create()方法 ModelSeri ...
- [leetcode]存在重复
题目描述: 给定一个整数数组,判断是否存在重复元素. 如果任何值在数组中出现至少两次,函数返回 true.如果数组中每个元素都不相同,则返回 false. 示例 1: 输入: [1,2,3,1] 输出 ...
- VMware14虚拟机与宿主机建立通讯
当我们在VMware14中运行虚拟机搭建实验环境就需要与我们的宿主机或另一台虚拟机连接通讯,下面我们就来看看如何建立通讯,实现虚拟机与宿主机.虚拟机与虚拟机互联互通. 准备环境:一台安装好VMware ...