demo:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>vue入门</title>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
</head>
<body>
<div id="first">
<div v-show="show">看到啦</div>
<button @click="handleclick">按钮</button>
</div>
<script>
new Vue({
el:"#first",
data:{
show:true
},
methods:{
handleclick:function(){
this.show=!this.show; }
}
})
</script>
</body>
</html>

  效果:

2018-05-02  00:04:15

vue v-show指令的更多相关文章

  1. 02: vue.js常用指令

    目录:Vue其他篇 01: vue.js安装 02: vue.js常用指令 目录: 1.1 vuejs简介 1.2 选择器:根据id.class等查找 1.3 静态绑定数据 data 1.4 插值 { ...

  2. Vue 3自定义指令开发

    本文由葡萄城技术团队原创并首发 转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 什么是指令(directive) 在Angular和Vue中都有Direct ...

  3. 最简单的方式理解Vue的自定义指令与混合

    vue.js 自定义指令 钩子函数:bindinsertedupdatecomponentUpdatedunbind 钩子函数完整实例:html: <div id="hook-argu ...

  4. vue.js自定义指令入门

    Vue.js 允许你注册自定义指令,实质上是让你教 Vue 一些新技巧:怎样将数据的变化映射到 DOM 的行为.你可以使用Vue.directive(id, definition)的方法传入指令id和 ...

  5. Vue.js自定义指令的用法与实例

    市面上大多数关于Vue.js自定义指令的文章都在讲语法,很少讲实际的应用场景和用例,以致于即便明白了怎么写,也不知道怎么用.本文不讲语法,就讲自定义指令的用法. 自定义指令是用来操作DOM的.尽管Vu ...

  6. vue 通过自定义指令实现 置顶操作;

    项目需求:要求当前项目每个页面滑到超出一屏的距离时,出现 backTop 按钮,点击则回到最顶端:俗称置顶操作: 因为涉及到的页面较多,每个页面都加肯定显得重复累赘,最终想到了 Vue 的自定义指令  ...

  7. Vue基础01vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令

    自学vue框架,每天记录重要的知识点,与大家分享!有不足之处,希望大家指正. 本篇将讲述:vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令 前期学习基础,使用vue. ...

  8. Vue(九) 自定义指令

    前面介绍了许多 Vue 内置的指令,比如 v-if.v-show等,这些丰富的指令能满足我们绝大部分的业务需求,不过在需要一些特殊功能时,我们仍然希望对 DOM 进行底层的操作,这时就要用到自定义指令 ...

  9. Vue.directive自定义指令

    Vue除了内部指令,我们也可以定义一些属于自己的指令,比如我们要定义一个v-diy的指令,作用就是让文字变成红色. 写好了这个功能,我们现在就自己定义一个全局的指令.我们这里使用Vue.directi ...

  10. vue.js常用指令

    本文摘自:http://www.cnblogs.com/rik28/p/6024425.html Vue.js的常用指令 上面用到的v-model是Vue.js常用的一个指令,那么指令是什么呢? Vu ...

随机推荐

  1. Django框架(五)—— 虚拟环境搭建

    目录 Django虚拟环境搭建 Django虚拟环境搭建 一.为什么要用虚拟环境 公司以前开发的项目是在Django1.5的基础上开发的,先要需要基于Django2.0开发一套项目.这样不能卸载原有版 ...

  2. ajaxFileUpload.js插件支持多文件上传的方法

    前提条件:ajaxFileUpload.js插件多文件上传步骤:1.修改源码,(源码只支持单个文件的上传):复制代码 代码如下: //修改前代码------- //var oldElement = j ...

  3. react 中刷新,路由传参数丢失不存在了?

    你可能在Link to没写state {{pathname:'/report',state:{storageClear:this.state.storageClear}}}

  4. forEach方法

    *forEach() * -这个方法只支持ie8以上的浏览器 * -forEach方法需要一个函数作为参数 * -像这种函数,由我们创建但是不由我们调用,我们称为回调函数 * 数组中由几个元素函数就会 ...

  5. 2018-2-13-win10-UWP-动画

    title author date CreateTime categories win10 UWP 动画 lindexi 2018-2-13 17:23:3 +0800 2018-2-13 17:23 ...

  6. 开启SSH 使用SSH登录工具连接虚拟机

    修改sshd_config文件,命令为:vi /etc/ssh/sshd_config将#PermitRootLogin without-password注释去掉修改为PermitRootLogin ...

  7. python sorted()的简单使用

    今天在学习python的时候,碰到了sorted()这个函数,其作用是在不改变列表排序的情况下,将列表的内容按照特定的顺序表示出来. 在练习的时候,编辑了几条命令进行测试. cars=['bmw',' ...

  8. poi之Excel(在线生成)下载

    Apache POI是Apache软件基金会的开放源码函式库,POI提供API给Java程序对Microsoft Office格式档案读和写的功能. poi之Excel下载 @RequestMappi ...

  9. JavaWeb学习篇之----自定义标签&&JSTL标签库详解

    今天来看一下自定义标签的内容,自定义标签是JavaWeb的一部分非常重要的核心功能,我们之前就说过,JSP规范说的很清楚,就是Jsp页面中禁止编写一行Java代码,就是最好不要有Java脚本片段,下面 ...

  10. BZOJ 2225: [Spoj 2371]Another Longest Increasing (CDQ分治+dp)

    题面 Description 给定N个数对(xi, yi),求最长上升子序列的长度.上升序列定义为{(xi, yi)}满足对i<j有xi<xj且yi<yj. Input Output ...