vue2.0版本指令v-if与v-show的区别

v-if: 判断是否加载,可以减轻服务器的压力,在需要时加载。

v-show:调整css dispaly属性,可以使客户端操作更加流畅。

v-if示例:

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script src="vue2.2.js"></script></head><body><!--与v-else一样,v-else-if 必须要在v-if或者-else-if之后--><div id="app"><h1>hello,VueJs</h1><h1 v-if="yes">Yes!</h1><h1 v-if="no">No!</h1><h1 v-if="age>=25">Age1:{{age}}</h1><h1 v-else-if="age<25">Age2:{{age}}</h1><h1 v-if="name.indexOf('ab')>=0">name1:{{name}}</h1><h1 v-else>Name2:{{name}}</h1></div><script>var vm = new Vue({el: "#app",data: {yes: true,no: false,age: 18,name: "Mr.lan"}})</script></body></html>

v-show示例:

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script src="../vue2.2.js"></script></head><body><!--注意v-show不支持<template>语法注意v-show的元素会始终渲染并保持在DOM中,v-show是简单的切换元素的css属性display--><div id="app"><p v-show="ok">v-show演示1</p><p v-show="!ok">v-show演示2</p></div><script>var vm = new Vue({el:"#app",data:{ok:false}})</script></body>
</html>

 

转载于:https://www.cnblogs.com/lhl66/p/7492074.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/354872.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

oracle 中增加行,Oracle中实现FORM表单插入、锁定、更新行、删除行的包

此包写在oracle数据库中&#xff0c;供Form表单调用&#xff1a;CREATE OR REPLACE PACKAGE BODY cux_main_pkg AS/*** PROCEDURE: insert_row()***/PROCEDURE insert_row(x_row_id IN OUT VARCHAR2,x_insp_header_id IN OUT NUMBER,p_org_id IN…

IE8兼容问题

setInterval 的用法如下&#xff1a; function func() { setInterval("alert()", 1000, this); // chrome 适用, 但不能传参数 setInterval("alert", 1000, this); // chrome、ie8 都不适用 setInterval(alert, 1000, this); // chrome 适用&…

CUBA平台正在开源

期待已久的时刻已经到来&#xff0c;现在我们很高兴地宣布&#xff0c; CUBA平台终于加入了自由软件社区&#xff01; 从现在开始&#xff0c;平台的所有运行时部分都是开源的&#xff0c;并根据Apache 2.0许可进行分发。 这意味着您将完全可以免费创建和分发应用程序&#xff…

oracle 9i 手工建库,简单记录Oracle 9i数据库手工建库过程

简单记录Oracle 9i数据库手工建库过程Oracle 9i手工建库By Oracle老菜今天客户要用oracle 9.2.0.5&#xff0c;aix 6.1已经不支持了&#xff0c;只好从别的数据库把软件拷贝过来重编译。但是建库只能用手工建库了。很久没有使用手工建库了&#xff0c;简单记录下建库过程1.设置…

LazyInitializationException的四个解决方案–第2部分

本文从本教程的第1部分继续。 有状态EJB使用PersistenceContextType.EXTENDED进行负载收集 该方法只能应用于与Full JEE环境兼容的应用程序&#xff1a;将EJB与PersistenceContextType.EXTENDED一起使用。 检查下面的代码&#xff0c;DAO的样子&#xff1a; package com.ejb…

SecureCRT在卸载时似乎会同时删除系统自带的Consolas字体

今天卸载了SecureCRT的安装板&#xff0c;改用绿色版&#xff0c;没想到删完之后再运行ItelliJ IDEA&#xff0c;所有的字包括行号都变成乱码了&#xff0c;而且这些乱码并不是很乱&#xff0c;英文大部分都是注音符号&#xff0c;中文字还能正常显示&#xff01;仔细查看各种编…

SpringBoot:使用JdbcTemplate

Spring使用JdbcTemplate在JDBC API的基础上提供了一个很好的抽象&#xff0c;并且还使用基于注释的方法提供了强大的事务管理功能。 首先&#xff0c;通过注册DataSource &#xff0c; TransactionManager和JdbcTemplate Bean&#xff0c;快速浏览一下我们通常如何使用Spring的…

混合高斯模型(Mixtures of Gaussians)和EM算法

混合高斯模型&#xff08;Mixtures of Gaussians&#xff09;和EM算法 这篇讨论使用期望最大化算法&#xff08;Expectation-Maximization&#xff09;来进行密度估计&#xff08;density estimation&#xff09;。 与k-means一样&#xff0c;给定的训练样本是&#xff0c;我们…

wordpress archive.php,wordpress分类目录模板(archive.php)制作

本课程视频是VIP会员课程&#xff0c;学习请进入VIP学习区。分类目录模板通常包括二种&#xff0c;一种是普通文章列表目录&#xff0c;一种是产品图片展示列表目录。文章列表目录是通过将分类下的文章标题通过无序列表的形式展示出来。如下图。产品图片列表目录是将产品的第一…

oracle exp 00006,Oracle 12.1新特性----使用RMAN从备份中实现recover table

Oracle 12.1新特性----使用RMAN从备份中实现recover table发布时间&#xff1a;2020-06-26 19:41:44来源&#xff1a;51CTO阅读&#xff1a;4750作者&#xff1a;hbxztc在Oracle12c版本之前&#xff0c;使用RMAN能恢复的级别为数据库级别和表空间级别&#xff0c;如果只有一张表…

spring social_Spring Social入门–第2部分

spring social几周前&#xff0c;我写了一篇文章&#xff0c;展示了我认为可以使用Spring Social编写的最简单的应用程序。 该应用程序读取并显示了Twitter用户的公共数据&#xff0c;并被编写为Spring Social和社交编码领域的介绍。 但是&#xff0c;让您的应用程序显示用户的…

【luogu 1024 一元三次方程求解】二分思想

题目出自luogu 1024 一元三次方程求解 描述&#xff1a; 有形如&#xff1a;ax3bx2cxd0 这样的一个一元三次方程。给出该方程中各项的系数(a&#xff0c;b&#xff0c;c&#xff0c;d 均为实数)&#xff0c;并约定该方程存在三个不同实根(根的范围在-100至100之间)&#xff0c;…

linux c统计进程网络读写,linux网络分析、性能分析、文本格式化、文件读写操作之利器(mtr、top、jq、sponge)...

好的工具能够让我们工作更加高效&#xff0c;结合工作中的情况&#xff0c;今天分享下linux下比较好用的几个工具。网络分析工具mtrmtr是网络链路检测判断问题非常好用的工具&#xff0c;集成了tracert和ping这两个命令的功能&#xff0c;动态的输出检测结果。mtr 默认发送icmp…

局域网(校园网)内服务之间通过ssh -L互相访问

一、前言 同一个局域网内有两台linux服务器A和B&#xff0c;B上有一个服务&#xff0c;可以通过curl传输数据访问&#xff0c;现在想从A上也通过curl访问B上的服务 二、两种情况 1. 如果B服务器上使用docker: 首先建立docker容器时&#xff0c;需要做端口映射 docker run …

ubantu 中配置Flash Player

1.Flash只能在Chrome中使用它的最新版本。 2.如果你使用的是Firefox浏览器&#xff0c;那么你需要更换浏览器才能使用最新版本的Flash。如果你使用的Chrome浏览器&#xff0c;你只需要将它升级到最新版本就可以了。 转载于:https://www.cnblogs.com/saturnlee/p/7502158.html

实施注释界面

对于Java开发人员来说&#xff0c;每天都需要使用注释。 如果没有别的&#xff0c;简单的Override注释应该响起。 创建注释要复杂一些。 在运行时通过反射使用“自制”注释或创建编译时调用的注释处理器也是一种复杂性。 但是我们很少“实现”注释接口。 暗中有人暗地里为我们做…

C++入门经典-例2.13-左移运算

1&#xff1a;代码如下&#xff1a; // 2.13.cpp : 定义控制台应用程序的入口点。 //#include "stdafx.h" #include<iostream> using namespace std; void main() {int a0x40,b;ba<<1;//左移1位cout << b << endl;//以十进制输出 } View Cod…

linux修改su的PAM配置文件,linux pam安全认证模块su命令的安全隐患

PAM安全认证1、su命令的安全隐患默认情况下&#xff0c;任何用户都允许使用su命令&#xff0c;从而有机会反复尝试其他用户(如root)的登录密码&#xff0c;带来安全风险。为了增强sum命令的使用控制&#xff0c;可以借助PAM认证模块&#xff0c;只允许极个别用户使用su命令进行…

jwebsocket传图片_Java中带有JWebSocket的WebServerSocket

jwebsocket传图片首先&#xff0c;转到http://jwebsocket.org/下载2个软件包Server and Client。 如果要查看源代码&#xff0c;请下载源代码包。 服务器 解压缩服务器程序包。 转到“ conf”文件夹 选择“ jWebSocket.xml”文件打开 编辑“ jWebSocket.xml”文件&#xff…

i3能装Linux虚拟机,使用i3wm重新安装Ubuntu

过去几天&#xff0c;我一直在Kubuntu 14.04.1 LTS(Ubuntu衍生产品)上使用i3wm&#xff0c;但体验有些不同。由于Ubuntu使用LightDM Display Manager&#xff0c;因此您可以安装i3wm并尝试与当前的窗口管理器一起使用。只需在外壳中使用以下命令安装适当的软件包&#xff1a;su…