<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

    </head>

    <body>

        <div id="app">

                <h1 v-show="ok">Hello!</h1>  //条件为TRUE，输出

                <h1 v-show="error">false!</h1>  //条件为false，不输出

                <h1 v-show="10>5">10大于5，输出!</h1>   //条件为TRUE，输出

                <h1 v-show="2>10">不大于10，不输出!</h1>   //条件为false，不输出

        </div>

    </body>

    <script>

        new Vue({

            el: '#app',

            data: {

                ok: true,

                error: false

            }

        })

    </script>

</html>

截图：

Vue 中 使用v-show的更多相关文章

  1. vue中的vue-cli

    在前面的学习过程中我相信你们已经对vue有了一定的了解,现在我们来看一下vue中的vue-cli. 学习这个我们首先需要的是node环境的,如果你的网络环境慢的话建议安装淘宝镜像,在cmd中输入 np ...

  2. Vue学习笔记七：Vue中的样式

    目录 两种样式 class样式 内联样式 两种样式 Vue中使用样式方式有两种,一种是class样式,一种是内联样式也就是style class样式 class样式使用的方式有5种,HTML如下 &l ...

  3. vue 中 直接操作 cookie 及 如何使用工具 js-cookie

    转载:https://www.cnblogs.com/xiangsj/p/9030648.html vue 中直接操作 cookie 以下3种操作方式 set: function (name, val ...

  4. vue中的filters的用法

    1.效果 金额保留两位小数,并加上单位元 2.index.html <!DOCTYPE html> <html lang="en"> <head> ...

  5. vue中动态添加div

    知识点:vue中动态添加div节点,点击添加,动态生成div,点击删除,删除对应的div,其中数组的长度是动态改变的,如在from表单中应用,直接在提交方法中,获得list,获取所填的元素即可 效果: ...

  6. vue中$watch源码阅读笔记

    项目中使用了vue,一直在比较computed和$watch的使用场景,今天周末抽时间看了下vue中$watch的源码部分,也查阅了一些别人的文章,暂时把自己的笔记记录于此,供以后查阅: 实现一个简单 ...

  7. 025——VUE中事件的基本使用与VUE中差异

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. 024——VUE中filter的使用

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. 023——VUE中数据排序sort() / 数据反转 reverse() 的使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. 022——VUE中remove()方法的使用：

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 360度3D 旋转插件

    Circlr插件是一款基于jQuery的可以对图片进行360度全方位旋转展示的插件.Circlr通过按一定角度规律拍摄的产品图片,制作出可以使用鼠标拖动.鼠标滚轮和移动触摸来进行图片逐帧旋转的效果.比 ...

  2. RocketMQ吐血总结

    RocketMQ吐血总结 架构 概念模型 最基本的概念模型与扩展后段概念模型 存储模型 RocketMQ吐血总结 User Guide RocketMQ是一款分布式消息中间件,最初是由阿里巴巴消息中间 ...

  3. 解决 SQLPlus无法登陆oracle,PLSql可以登陆,报错ORA-12560

    使用Oracle 11g 64位服务器,安装64位.32位客户端,出现SQLPlus无法连接数据库,PLSql可以连接问题. 网上查了很多,都不能解决问题,在下面提供一种. 环境变量 右击计算机属性- ...

  4. vue打包时，assets目录 和static目录下文件的处理区别（nodeModule中插件源码修改后，打包后的文件应放在static目录）

    为了回答这个问题,我们首先需要了解Webpack如何处理静态资产.在 *.vue 组件中,所有模板和CSS都会被 vue-html-loader 及 css-loader 解析,并查找资源URL.例如 ...

  5. java压缩文件中文名乱码问题

    import java.util.zip.ZipEntry; import java.util.zip.ZipOutputStream; 改为 import org.apache.tools.zip. ...

  6. Xadmin

    一.安装 Xadmin pip install https://codeload.github.com/sshwsfc/xadmin/zip/django2 二.导出文件 在公司开发中如何知道项目里别 ...

  7. PyCharm专业版下载安装

    目录 1. 推荐阅读 2. PyCharm专业版 (目录) 1. 推荐阅读 Python基础入门一文通 | Python2 与Python3及VSCode下载和安装.PyCharm安装.Python在 ...

  8. ansible获取远程机器上的ip地址

    问题: 想要使用ansible-playbook脚本创建一个以远程机器的IP命名的目录 错误的代码:# vim test.yml --- - hosts: all remote_user: root ...

  9. ansible 的file 模块

    创建.修改.删除文件或者目录: file模块 file模块常用的几个参数:state.path.src.dest.mode.owner.group.name.recurse state后面跟的参数:  ...

  10. centos7 安装部署zabbix客户端

    1.下载安装zabbix-agent: # rpm -ivh http://repo.zabbix.com/zabbix/3.4/rhel/7/x86_64/zabbix-release-3.4-2. ...