vue之v-if v-else-if v-else 使用

缺乏、安全感 2022-04-06 17:44 184阅读 0赞

**vue之v-if v-else-if v-else 使用：**

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Vue demo</title>
        
        <script type="text/javascript" src="js/vue.min.js"></script>
        
    </head>
    <body>
        <div id="myVue">
    
            <p v-if="true">true的时候显示</p>
    
            <p v-if="false">false的时候隐藏</p><br/>
            
            
            <p v-if="age<18">未成年</p>
            <p v-else-if="age==18">刚好成年</p>
            <p v-else>成年人</p>
            
        </div>
        <script>
            /*定义Vue全局变量*/
            var app = new Vue({
                el:"#myVue",
                data:{
                    "name":"helloWord",
                    age:19
                }
            });
        </script>
    </body>
    </html>

结果：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N1cHJlemhlbmc_size_16_color_FFFFFF_t_70]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N1cHJlemhlbmc_size_16_color_FFFFFF_t_70]: /images/20220406/f5be62321c5a4f54939b7b24b4e8f334.png

发表评论取消回复

表情：

评论列表（有 0 条评论，184人围观）

还没有评论，来说两句吧...

相关阅读

相关 VUE之使用svg图标

目录一安装依赖二：配置webpack 2.1 首先创建一个svg文件用来保存图标 2.2 配置build文件夹中的webpac

今天药忘吃喽~/ 2023年07月20日 13:49/ 0 赞/ 17 阅读

相关怎样建立Vue工程之使用vue-cli

别人的好文章https://www.jianshu.com/p/0ae3e3bb3082 官方指南可能更加适合你https://cli.vuejs.org/zh/guide

刺骨的言语ヽ痛彻心扉/ 2022年10月24日 13:27/ 0 赞/ 121 阅读

相关 vue之el-date-picker使用

场景：设置默认值之后，重新选择日期，页面赋值不会生效，但是通过打印发现已经修改了，只是页面没有重新渲染。解决方法：不生效的处理方法：this

分手后的思念是犯贱/ 2022年10月05日 14:00/ 0 赞/ 170 阅读

相关 VIF检验相关性

`VIF`可以用来度量多重共线性问题， V I F j = 1 1 − R j 2 \\quad \\mathrm\{VIF\}\_\{j\}=\\frac\{1\}\{1-R

冷不防/ 2022年09月12日 02:55/ 0 赞/ 264 阅读

相关 vue之axios使用

一、安装 1、利用npm安装`npm install axios --save` 2、利用bower安装`bower install axios --save`

雨点打透心脏的1/2处/ 2022年06月13日 00:14/ 0 赞/ 285 阅读

相关 Vue之插槽使用

目录插槽简介示例代码运行结果 -------------------- 插槽简介 vue通过插槽和具名插槽可以向子组

桃扇骨/ 2022年05月19日 11:52/ 0 赞/ 216 阅读

相关 Vue之使用组件

创建一个组件Header.vue <template> <div class="header"> 这是header

超、凢脫俗/ 2022年04月22日 10:52/ 0 赞/ 220 阅读

相关 Vue之vue-resource插件使用

vue-resource 是实现Vue异步加载的库 vue-resource特点 1. 体积小 vue-resource非常小巧，在压缩以后只有大约12KB

Myth丶恋晨/ 2022年04月18日 05:45/ 0 赞/ 266 阅读

相关 Vue学习之过滤器的使用

过滤器概念： Vue.js 允许你自定义过滤器，可被用作一些常见的文本格式化。过滤器可以用在两个地方：mustache 插值和 v-bind 表达式。过滤器应该被添

旧城等待，/ 2021年11月29日 04:46/ 0 赞/ 384 阅读

相关 Vue之axios基础使用

答：axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端，它有哪些特征：

小灰灰/ 2020年05月15日 09:56/ 0 赞/ 915 阅读