---恢复内容开始---

首先,在跟着api做的时候,要把v-if包裹在Vue对应的el里面,重要的事情说三遍。

html:

<div id="vif">
<div v-if="Math.random() > 0.1">
Now you see me
</div>
<div v-else>
Now you don't
</div>
</div>

js:

var app13=new Vue({
el:'#vif'
});

这样才能显示其中一个标签的内容。(v-else必须紧挨着v-if)

v-show与v-if 的区别在于v-show所对应的元素会一直被渲染出来,v-show所做的只是切换该元素的css属性。v-if值如果是false,则该元素不会出现在DOM中

---恢复内容结束---

Vue.js之v-if的更多相关文章

  1. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

  2. Vue.js学习笔记(1)

    数据的双向绑定(ES6写法) 效果: 没有改变 input 框里面的值时

  3. vue.js初级入门之最基础的双向绑定操作

    首先在页面引入vue.js以及其他需要用到的或者可能要用到的插件(这里我多引用了bootstrap和jquery) 引用的时候需要注意文件的路径,准备工作这样基本就完成了,下面正式开始入门. vue. ...

  4. Vue.js的入门

    介绍 vue.js 是一个客户端js库,可以用来开发单页应用.为了一个项目的选型,我前前后后的看了angular.react.vuejs ,对前两者是佩服,对后者是爱.因为它简洁干净利索,并且还有高大 ...

  5. Vue.js学习笔记(2)vue-router

    vue中vue-router的使用:

  6. vue.js在windows本地下搭建环境和创建项目

    Vue.js是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.另一方面,Vu ...

  7. 一份不错的vue.js基础笔记!!!!

    第一章 Vue.js是什么? Vue(法语)同view(英语) Vue.js是一套构建用户界面(view)的MVVM框架.Vue.js的核心库只关注视图层,并且非常容易学习,非常容易与其他库或已有的项 ...

  8. vue.js+boostrap最佳实践

    一.为什么要写这篇文章 最近忙里偷闲学了一下vue.js,同时也复习了一下boostrap,发现这两种东西如果同时运用到一起,可以发挥很强大的作用,boostrap优雅的样式和丰富的组件使得页面开发变 ...

  9. Vue.js常见问题

    1.Vuejs组件 vuejs构建组件使用 Vue.component('componentName',{ /*component*/ }): 这里注意一点,组件要先注册再使用,也就是说: Vue.c ...

  10. vue.js+boostrap

    vue.js+boostrap最佳实践 一.为什么要写这篇文章 最近忙里偷闲学了一下vue.js,同时也复习了一下boostrap,发现这两种东西如果同时运用到一起,可以发挥很强大的作用,boostr ...

随机推荐

  1. JSON解析和XML解析对比

    JSON解析和XML解析是较为普遍的两种解析方式,其中JSON解析的市场分额更大.本文系统的分析两种解析方式的区别,为更好地处理数据作准备.由于目前阶段主要是做移动开发,所以本文所描述的JSON解析和 ...

  2. IOS开发之----#import、#include和@class的区别

    1. 一般来说,导入objective c的头文件时用#import,包含c/c++头文件时用#include. 2. #import 确定一个文件只能被导入一次,这使你在递归包含中不会出现问题.&l ...

  3. 学习ES6生成器(Generator)

    背景 在JS的使用场景中,异步操作的处理是一个不可回避的问题,如果不做任何抽象.组织,只是“跟着感觉走”,那么面对“按顺序发起3个ajax请求”的需求,很容易就能写出如下代码(假设已引入jQuery) ...

  4. 使用私有Pod Spec的类库--提高公司开发效率

    前言 找了这么长时间,再次开始去尝试Cocoapods了.前面已经写过一篇关于如何把自己的Github上的代码库添加Cocoapods支持.现在就让我们看一下如果搭建私有的Spec吧. 之所以构建私有 ...

  5. 基于ntp的多服务器时间同步脚本

    server服务器每1个小时更新一次时间,server服务器旗下同步服务器每5秒钟同步一次时间,同步服务器与外网不做交互,由server服务器进行同步时间.所以保证每一台同步服务器时间一致. #vi ...

  6. 关于watir-webdriver中文乱码问题

    require 'watir-webdriver' require 'iconv' cov = Iconv.new( 'gbk', 'utf-8') b = Watir::Browser.new b. ...

  7. vim linux下查找显示^M并且删除

    linux下 ^M的输入方法是ctrl+v然后再ctrl+m vim下在文件中显示^M:e ++ff=unix % 在文件中删除^M:%s/^M$//g 在linux下查找^Mfind ./ | xa ...

  8. 八爪鱼招标网的百度权重升为2了,独立IP也从0快速发展为1000

      自八爪鱼招标网上线以来,本着以客户一切利益为出发点,坚持提供国内首个免费招标信息平台为目标,经过各位同事不断地努力,不断收集客户各种各样的招标.采购实际需求,与政府.事业单位及中小型企业一对一的沟 ...

  9. 如何查看Oracle客户端版本

    在实际工作中,总会遇到一些需要查看.验证ORACLE客户端版本的问题,因为一台服务器可能装了多个Oracle客户端版本:也有可能你需要知道安装的版本是32位还是64位的.如何查看Oracle客户端(O ...

  10. 报表开发之批量导入导出excel

    在日常使用报表过程中,会有这样一种情况,你将Excel表分发给各个员工,员工填完后,统一整理成多个Excel,你需要将这些数据,用报表的填报功能,提交录入到数据库中,这样一来可避免到服务器机房录数据的 ...