<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>v-if、v-else、v-show</title>
    <script src="../js/vue.js"></script>
    <!--copy from http://vuejs.org.cn/guide/-->
</head>
<body>
    <div id="app">
        <p v-if="willShow">显示</p>
        <p v-else>隐藏</p>
        <button @click="fn()">改变</button>
    </div>
    <script>
        var vm=new Vue({
el:"#app",
data:{
willShow:true
},
methods:{
fn:function(){
if(this.willShow==true){
this.willShow=false;
}else{
this.willShow=true
}
}
}
});
</script>
</body>
</html>

Vuejs methods how to use的更多相关文章

  1. vuejs学习笔记（1）--属性，事件绑定，ajax

    属性 v-for 类似于angular中的 ng-repeat ,用于重复生成html片段: <ul id="box"> <li v-for="(v, ...

  2. vuejs学习笔记（2）--属性，事件绑定，ajax

    属性 v-for 类似于angular中的 ng-repeat ,用于重复生成html片段: <ul id="box"> <li v-for="(v, ...

  3. 开始使用 Vuejs 2.0 ---简单总结2

    Vuejs的常用指令 v-html v-show v-if v-for v-on 1 .v-html v-html 更新元素或者变量的innerHTML,按普通html解析,和v-text的区别是在变 ...

  4. vue入门：（事件处理）

    基本应用 修饰符 为什么要在HTML中使用事件监听 Demo 一.基本应用 1.通过v-on指令绑定事件,例如: <button v-on:click="">提交< ...

  5. Vuejs中关于computed、methods、watch的区别。

    Vue.js在模板表达式中限制了,绑定表达式最多只能有一条表达式,但某些数据需要一条以上的表达式运算实现,此时就可以将此数据放在计算属性(computed)当中. Vuejs中关于computed.m ...

  6. Vuejs中关于computed、methods、watch，mounted的区别

    1.computed是在HTML DOM加载后马上执行的,如赋值: 2.methods则必须要有一定的触发条件才能执行,如点击事件: 3.watch呢?它用于观察Vue实例上的数据变动.对应一个对象, ...

  7. 使用vuejs框架进行列表渲染

    爱编程爱分享,原创文章,转载请注明出处,谢谢!http://www.cnblogs.com/fozero/p/6170706.html 1.通过Script引入Vuejs框架 <script t ...

  8. vuejs的动态过滤

    想要通过vuejs动态过滤(这里动态指得是过滤的条件是动态变化的), 一直没找到好办法, 最蠢的办法当然是两个两个数组,一个作为原始副本数组 一个作为视图数组,这样当过滤条件变化的时候 动态拷贝原始数 ...

  9. Vuejs——（2）Vue生命周期，数据，手动挂载，指令，过滤器

    (八)传入的数据绑定 先创建一个对象(假如是obj),然后将他传入Vue实例中,作为data属性的值,那么 ①obj的值的变化,将影响Vue实例中的值的变化: ②相反一样: ③可以在Vue实例外面操纵 ...

随机推荐

  1. Django orm 中 python manage.py makemigrations 和 python manage.py migrate 这两条命令用途

    生成一个临时文件 python manage.py makemigrations 这时其实是在该app下建立 migrations目录,并记录下你所有的关于modes.py的改动,比如0001_ini ...

  2. 2.AS入门教程

    AndroidStudio 本文是关于androidStudio的一些基础知识 介绍 Google官方的Android集成开发环境(IDE = Integrated Development Envir ...

  3. PushState+Ajax实现简单的单页面应用SPA

    http://www.helloweba.com/view-blog-386.html 单页面应用(Single Page Application)简称SPA,使用SPA构建的应用优点有用户体验好.速 ...

  4. python 学习笔记(十四)有依赖关系的接口开发

    接口开发中存在很多有依赖关系的接口,例如:BBS中发帖的时候就需要进行校验用户是否登录,那么此时发帖的接口就与用户登录接口有依赖关系.在发帖时就需要先获取用户的session,与当前登录用户进行校验对 ...

  5. 谷歌浏览器Chrome错误提示Flash过期怎么办（转）

    在使用谷歌浏览器Chrome时,会碰到谷歌浏览器Chrome的错误提示:“Adobe Flash Player因过期而遭到阻止”,点击“更新插件”是不行的,国内的网络根本就打不开,点击“运行一次”是可 ...

  6. Java io流详解四

    转载地址:http://www.cnblogs.com/rollenholt/archive/2011/09/11/2173787.html 写在前面:本文章基本覆盖了java IO的全部内容,jav ...

  7. 【JXL】导出Excel

    基本设置 // File file = new File("d:\\writetest.xlsx");// WritableWorkbook wwb = Workbook.crea ...

  8. Hbase Region Server整体架构

    Region Server的整体架构 本文主要介绍Region的整体架构,后续再慢慢介绍region的各部分具体实现和源码 RegionServer逻辑架构图 RegionServer职责 1.    ...

  9. SpringSource Tool Suite (STS)无法启动问题

    修改STS.ini,指定一个JRE路径: -vmD:\Program\Java\jdk1.7.0_79\bin\javaw.exe-startupplugins/org.eclipse.equinox ...

  10. CentOS 相关软件安装 与 Siege压测

    1.登录linux机器 a.打开mac的钥匙串 b.ssl root@ip c.输入密码 常用命令: cat /proc/version  查看系统版本 cat /etc/issue control ...