vue权威指南笔记02——对比v-if与v-show
<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<title>对比v-if与v-show的使用</title>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
</head> <body class="native">
<div id="example">
<!-- 频繁切换显示隐藏：display:none -->
<p v-show="isHidden"> 默认单行(需要替换) </p>
<template v-show="!isHidden">
<h5>自定义多行显示：template替换内容</h5>
<p>Paragraph 1</p>
<p>Paragraph 2</p>
</template>
<!-- 三个判断以上：切换显示Dom节点 -->
<template>
<span v-if="isShow">成功</span>
<span v-else-if="isHidden">失败</span>
<span v-else-if="isHidden">已终止</span>
<span v-else>运行中</span>
</template>
</div>
</body> <script>
var examleVM2 = new Vue({
el: '#example',
data: {
isShow: true,
isHidden: false,
}
})
</script> </html>
vue权威指南笔记02——对比v-if与v-show的更多相关文章
- vue权威指南笔记01——样式的设置
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- Struts2权威指南笔记
Struts2权威指南笔记 1.mvc特点包括: ① 多个视图可以对应一个模型 ② 模型返回的数据与显示逻辑分离 ③ 应用层被分隔为三层,降低了各层之间的耦合,提供了应用的可扩展性 ④ 控制层的概念也 ...
- 【vue 权威指南】 学习笔记 一
内容简介 vue.js 是一个用来开发Web界面的前端库. 1.vue.js 是什么 vue.js 是一个构建数据驱动的web界面的库,vue.js 通过简单的API提供高效的数据绑定和灵活的组件系统 ...
- 【vue 权威指南】 学习笔记 二
1.指令 1.1内部指令 基础指令:v-show , v-else , v-model , v-repeat , v-for , v-text , v-el , v-html , v-on , v-b ...
- javascript权威指南笔记
最近每天工作之余看下js的细节部分,时间不是很多,所以看的进度也不会太快,写个博客监督自己每天都看下. 以前不知道的细节或者以前知道但是没注意过的地方都会记录下来,所以适合有一定基础的,不适合零基础新 ...
- HTTP权威指南笔记-1.概述
1.1 通讯 Web内容是存储在服务器上的,Web服务所使用的是HTTP协议,所以经常称为HTTP服务器.通讯过程为客户端(正常我们所使用的)发出请求,服务端根据客户端的HTTP请求响应相应数据,这就 ...
- css 权威指南笔记（一）
零零散散接触css将近5年,俨然已经成为一个熟练工.如果不是换份工作,我不知道自己差的那么远:在qunar的转正review中我这种“知其然而不知其所以然” 的状况被标明,我才意识到我已停步不前近两年 ...
- vue视频学习笔记02
video 2 vue制作weibo交互 vue-> 1.0vue-resource ajax php服务器环境(node) this.$http.get()/post()/jsonp() th ...
- Android编程权威指南笔记3:Android Fragment讲解与Android Studio中的依赖关系，如何添加依赖关系
Android Fragment 当我在学习时,了解了Fragment词汇 Fragment是一种控制器对象,我就把所了解的简单说一下.activity可以派fragment完成一些任务,就是管理用户 ...
随机推荐
- Spring Boot开启的 2 种方式
Spring Boot依赖 使用Spring Boot很简单,先添加基础依赖包,有以下两种方式 1. 继承spring-boot-starter-parent项目 <parent> < ...
- 个人总结的一个中高级Java开发工程师或架构师需要掌握哪几点！
今天,我来唠叨几句~~ 知识改变命运,对于Java程序员来说,技术不断更新,只有及时充电,才能不被市场淘汰.今天为大家分享Java程序员学习的6个小技巧. 1.一定要看书 现在学习Java变得比以前容 ...
- python之有用的3个内置函数（filter/map/reduce）
这三个内置函数还是非常有用的,在工作中用的还不少,顺手,下面一一进行介绍 1.filter 语法:filter(function,iterable) 解释:把迭代器通过function函数进行过滤出想 ...
- java微信分享
先吐槽一下!!! 哎,张小龙写的教程真差,要研究半天才能用上,大家按我的步骤12345,包你药到病除: 1.官方参考: https://mp.weixin.qq.com/wiki?t=resource ...
- PL/SQL Developer从11.0.6版本开始32/64为之区分
PL/SQL Developer从11.0.6版本开始32/64为之区分 在PL/SQL Developer11.0.6版本之前,64位Windows操作系统在使用PL/SQL Developer都未 ...
- Spring Cloud Ribbon入门
一.简介 Spring Cloud Ribbon是一个基于Http和TCP的客户端负载均衡工具,它是基于Netflix Ribbon实现的.它不像服务注册中心.配置中心.API网关那样独立部署,但是它 ...
- TensorFlow中数据读取之tfrecords
关于Tensorflow读取数据,官网给出了三种方法: 供给数据(Feeding): 在TensorFlow程序运行的每一步, 让Python代码来供给数据. 从文件读取数据: 在TensorFlow ...
- 动态规划法（八）最大子数组问题（maximum subarray problem）
问题简介 本文将介绍计算机算法中的经典问题--最大子数组问题(maximum subarray problem).所谓的最大子数组问题,指的是:给定一个数组A,寻找A的和最大的非空连续子数组.比如 ...
- MVC EF 执行SQL语句（转载）
MVC EF 执行SQL语句 最近悟出来一个道理,在这儿分享给大家:学历代表你的过去,能力代表你的现在,学习代表你的将来. 十年河东十年河西,莫欺少年穷 学无止境,精益求精 闲着没事,看了一篇关于LI ...
- Extjs4.2+webAPI+EF实现分页以及webapi的数据传值(续）
现在领导又要增加功能,需要分页的时候,每页显示N条信息.由于是每个页面都要改,所有需要声明了一个扩展类代码如下: // Copyright : 欧蓝德畅电子技术有限公司. All rights res ...