条件判断能否显示

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>vue的逻辑判断学习</title>

     <script type="text/javascript" src="./js/vue.js"></script>

     <script type="text/javascript">

     window.onload= function(){

         var app = new Vue({

             el:"#a",

             data:{

                 //能否显示

                 seen:true,

                 seen1:false

             }

         });

     }

     </script>

 </head>

 <body>

     <div id="a">

         <!-- 使用vue的判断标签来显示或者隐藏元素 -->

         <p v-if="seen">你能看见我</p>

         <span v-if="seen1">你不能看见我</span>

             <!-- 判断 if else 随机出现-->

         <div v-if="Math.random() > 0.5">

         现在你能看见我

         </div>

         <div v-else>

         你现在看不见我

         </div>

     </div>

 </body>

 </html>

vue简单逻辑判断的更多相关文章

  1. Vue简单基础 + 实例 及 组件通信

    vue的双向绑定原理:Object.defineProperty() vue实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty() 来劫 ...

  2. vue简单实现

    vue简单实现 vue的三个核心 虚拟dom, 双向绑定 Proxy,

  3. html vue简单

    1.Vue 简单的替换更新 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  4. 一篇文章带你了解网页框架——Vue简单入门

    一篇文章带你了解网页框架--Vue简单入门 这篇文章将会介绍我们前端入门级别的框架--Vue的简单使用 如果你以后想从事后端程序员,又想要稍微了解前端框架知识,那么这篇文章或许可以给你带来帮助 温馨提 ...

  5. vue（2）—— vue简单语法运用，常用指令集

    按照前面的文章:vue(1)——node.js安装使用,利用npm安装vue  安装完vue之后,就可以使用vue了 vue vue简介 前面安装好vue之后,确实还没有对vue进行介绍,首先,官网: ...

  6. vue初学实践之路——vue简单日历组件(1)

    ---恢复内容开始--- 最近做的项目有一个需求,需要有一个日历组件供预定功能使用,之前的代码过于繁琐复杂,所以我采用vue重写了这个组件. npm.vue等等安装. 只是一个简单的日历组件,所以并不 ...

  7. 极速搭建RTMP直播流服务器+webapp (vue) 简单实现直播效果

    在尝试使用webRTC实现webapp直播失败后,转移思路开始另外寻找可行的解决方案.在网页上尝试使用webRTC实现视频的直播与看直播,在谷歌浏览器以及safari浏览器上测试是可行的.但是基于基座 ...

  8. vue简单介绍

    最近在逛各大网站,论坛,以及像SegmentFault等编程问答社区,发现Vue.js异常火爆,重复性的提问和内容也很多,楼主自己也趁着这个大前端的热潮,着手学习了一段时间的Vue.js,目前用它正在 ...

  9. vue简单demo

    为了学习基础语法,我并没有用vue-cli脚手架来vue init [基于什么类型]  [项目名称]初始化项目,而是直接<script>../vue.js</script> & ...

随机推荐

  1. App与Js交互（三）Android、iOS通用解决方案推荐

    https://www.jianshu.com/p/6224f429ce87 window.navigator.userAgent用来区分设备和浏览器 https://blog.csdn.net/li ...

  2. c# 外挂操作（内存操作）（内存读写取窗口句柄移动窗口取模块地址）工具类

    来源于网上  参考 https://www.cnblogs.com/fuhua/p/5877781.html 等众多文章 详情取看我第二个例子封装功能较多 https://www.cnblogs.co ...

  3. QEMU 配置网络

    背景 为了 实现 uboot 中连接上 QEMU-host 的网络. 非常奇怪,本人的 系统中 存在/dev/net/tun驱动,但是 lsmod | grep tun 却没有任何结果,所以实际上,这 ...

  4. Adapter之ArrayAdapter以及监听器设置

    前言: ArrayAdapter:支持泛型操作,最简单的一个Adapter,只能展现一行文字~,我的学习就是通过这个最简单的适配器开始 正文: 完成这个ArrayAdapter需要三步:1.初始化数据 ...

  5. UVA - 1608 Non-boring sequences （分治）

    题意:如果一个序列的任意连续子序列中至少有一个只出现一次的元素,则称这个序列式为non-boring.输入一个n(n≤200000)个元素的序列A(各个元素均为109以内的非负整数),判断它是否无聊. ...

  6. c#查看本机网络端口和对应的程序名

    360安全卫士里面有个组件叫流量防火墙,感觉挺好用,但是不想安装360全家桶,于是自己捣鼓着用C#写一个比较简化的版本. 查看电脑上开启的TCP或UDP端口,可以用netstat命令,netstat用 ...

  7. 使用 Exchange 命令行管理程序查看动态通讯组的成员

    本示例返回名为 "全职员工" 的动态通讯组的成员列表. 第一个命令将动态通讯组对象存储在变量$FTE中. 第二个命令使用 Get-Recipient cmdlet 列出与为动态通讯 ...

  8. cf 764A、762A、764B

    颓废题 764A #include<bits/stdc++.h> #define LL long long #define N 100005 #define lowbit(x) x& ...

  9. ActiveMQ持久化机制和JMS可靠消息

    1.ActiveMQ持久化机制 1.1 JDBC将数据持久化到数据库 1.2 AMQ生成日志文件 1.3 KahaDB:本次磁盘生成数据文件(默认) 1.4 LevelDB:谷歌K/V数据库 1.5 ...

  10. AS经济Essay写作想拿高分其实并不难！

    在ALEVEL经济学这门课中,最难的部分应该属于essay question部分,因为很多题目的问题方式是很多变的,考官对于考生的期望值要求也是非常高的. 很多学生觉得自己清楚题目中的知识点,但是最终 ...