vue快速入门(六)v-else和v-else-if

注释很详细,直接上代码

上一篇

新增内容

  1. v-else-if用法
  2. v-else用法

源码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><!-- 挂载点 --><div id="root"><div v-if="gender === 1">性别:男</div><div v-else>性别:女</div><div v-if="level === 'A'">等级:A</div><div v-else-if="level === 'B'">等级:B</div><div v-else>等级:C</div></div><!-- 导入vue的js代码 --><script src="./lib/vue2.js"></script><script>const app = new Vue({// Vue实例el: '#root',// 挂载点data: {// 数据gender:1,level:'A'}})</script>
</body>
</html>

效果演示

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/792857.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

枚举类练习

练习一 案例&#xff1a;使用枚举类实现单例模式 package chapter08_oop3_teacher.src.com.atguigu10._enum.exer1;/*** ClassName: BankTest1* Description:** Author 尚硅谷-宋红康* Create 15:05* Version 1.0*/ public class BankTest1 {public static void main(String[]…

Excel、PowerQuery 和 ChatGPT 终极手册(上)

原文&#xff1a;Ultimate ChatGPT Handbook for Enterprises 译者&#xff1a;飞龙 协议&#xff1a;CC BY-NC-SA 4.0 序言 在不断发展的数据管理和分析领域中&#xff0c;掌握 Excel 的查找功能不仅是一种技能&#xff0c;更是高效数据处理的基石。《使用 Power Query 和 Ch…

论文阅读:Walk These Ways: 通过行为多样性调整机器人控制以实现泛化

Walk These Ways: 通过行为多样性调整机器人控制以实现泛化 摘要&#xff1a; 通过学习得到的运动策略可以迅速适应与训练期间经历的类似环境&#xff0c;但在面对分布外测试环境失败时缺乏快速调整的机制。这就需要一个缓慢且迭代的奖励和环境重新设计周期来在新任务上达成良…

Django模板层——三种自定义模板simple_tag、inclusion_tag、filter的用法

目录 1. 前言 2. 前置操作 3. simple_tag 3.1 注意点 4. inclusion_tag 5. filter 6. 结尾 1. 前言 在前后端不分离的模式中&#xff0c;Django的模板语法尤为重要&#xff0c;我们可以动态传入变量&#xff0c;并在前端HTML中进行展示。在变量展示时&#xff0c;会有一…

JavaWeb中的Servlet是什么?怎么使用?

文章目录 一、什么是Servlet二、Servlet的基本内容1、Servlet的作用2、Servlet接口3、Servlet接口实现类4、Servlet接口实现类开发步骤5、Servlet对象生命周期6、HttpServletResquest接口7、HttpServletResponse接口8、请求对象和响应对象流程图9、请求对象和响应对象生命周期1…

vulhub中Apache Solr 远程命令执行漏洞复现(CVE-2019-0193)

Apache Solr 是一个开源的搜索服务器。Solr 使用 Java 语言开发&#xff0c;主要基于 HTTP 和 Apache Lucene 实现。此次漏洞出现在Apache Solr的DataImportHandler&#xff0c;该模块是一个可选但常用的模块&#xff0c;用于从数据库和其他源中提取数据。它具有一个功能&#…

vue给input密码框设置眼睛睁开闭合对于密码显示与隐藏

<template><div class"login-container"><el-inputv-model"pwd":type"type"class"pwd-input"placeholder"请输入密码"><islot"suffix"class"icon-style":class"elIcon"…

三子棋(C游戏)

文章目录 三子棋的描述思路关键代码运行代码 三子棋的描述 三子棋是一种民间传统游戏&#xff0c;又叫九宫棋、圈圈叉叉棋、一条龙、井字棋等。游戏分为双方对战&#xff0c;双方依次在9宫格棋盘上摆放棋子&#xff0c;率先将自己的三个棋子走成一条线就视为胜利&#xff0c;…

机器学习之常用的回归预测模型

本文全面整理了各种回归预测模型&#xff0c;旨在帮助读者更好地学习回归预测模型。 转载自&#xff1a;https://mp.weixin.qq.com/s/7m2waIASOEg90NONgRpQFQ 一.线性模型 线性回归是一种线性模型&#xff0c;通过特征的线性组合来预测连续值标签。线性回归通过拟合系数 &…

实现 select 中嵌套 tree 外加搜索

实现 select 中嵌套 tree 外加搜索 参考地址实现地址 代码 <el-form-item label"考核人员" prop"userIdArr" v-if"title 发起考核"><el-popover v-model"popoverVisible" placement"bottom" trigger"cli…

论文笔记:Teaching Large Language Models to Self-Debug

ICLR 2024 REVIEWER打分 6666 1 论文介绍 论文提出了一种名为 Self-Debugging 的方法&#xff0c;通过执行生成的代码并基于代码和执行结果生成反馈信息&#xff0c;来引导模型进行调试不同于需要额外训练/微调模型的方法&#xff0c;Self-Debugging 通过代码解释来指导模型识…

Windows Server 2008 (限制用户登录时间、为客户机设置统一的桌面背景、管理用户统一安装软件、隐藏用户C盘)

一、限制用户登陆时间 Server&#xff1a; Client&#xff1a; Server&#xff1a; 将新建的用户移动到group1下 限制用户登陆时间 二、为客户机设置统一的桌面背景 Server&#xff1a; 将jpg图片放到abc文件夹中&#xff0c;并且设置文件夹共享模式 三、管理用户统一安装软件…

DFS:深搜+回溯+剪枝解决矩阵搜索问题

创作不易&#xff0c;感谢三连&#xff01;&#xff01; 一、N皇后 . - 力扣&#xff08;LeetCode&#xff09; class Solution { public:vector<vector<string>> ret;vector<string> path;bool checkcol[9];bool checkdig1[18];bool checkdig2[18];int n…

WordPress主题–Applay v3.7.1 开心版下载

Applay是一款功能强大的多用途WordPress主题&#xff0c;专为应用展示、应用商店、商业和购物等Woocommerce网站而设计。它配备了拖曳式页面编辑功能&#xff0c;类似于Elementor&#xff0c;让您能够轻松构建和定制您的网站。无论您有什么需求&#xff0c;都可以尝试下这个主题…

pandas中apply() 函数的应用

apply() 函数是 Pandas 中用于对 DataFrame 或 Series 中的数据进行自定义函数处理的函数。它可以将一个函数应用到 DataFrame 或 Series 的每一行或每一列&#xff0c;从而实现对数据的批量处理。 对于 Series 和 DataFrame&#xff0c;apply() 函数的基本语法如下&#xff1…

Flutter 画笔(Paint)、绘制直线(drawLine)

override bool shouldRepaint(CustomPainter oldDelegate) > true; } class MyPainter extends CustomPainter { override void paint(Canvas canvas, Size size) { //画背景 var paint Paint() …isAntiAlias false …strokeWidth30.0 …color Colors.red; c…

什么是Android ABI?

2024年4月4日&#xff0c;周四晚上 在Android开发中&#xff0c;ABI&#xff08;Application Binary Interface&#xff09;指的是应用程序二进制接口&#xff0c;它定义了应用程序与底层操作系统及硬件之间的接口规范。ABI包括了函数调用约定、数据类型、寄存器使用规则等内容…

金融贷款批准预测项目

注意&#xff1a;本文引用自专业人工智能社区Venus AI 更多AI知识请参考原站 &#xff08;[www.aideeplearning.cn]&#xff09; 在金融服务行业&#xff0c;贷款审批是一项关键任务&#xff0c;它不仅关系到资金的安全&#xff0c;还直接影响到金融机构的运营效率和风险管理…

8000预算可以购买阿里云服务器配置整理

一个月8000元预算如何选择阿里云服务器配置&#xff1f;八千预算可选的阿里云服务器配置相当高了&#xff0c;这个预算可以购买阿里云企业级独享型云服务器&#xff0c;至少8核以上的配置&#xff0c;这个预算可以支持复杂、高负载或大规模的业务需求。阿里云服务器网整理8000元…

微信小程序python+uniapp高校图书馆图书借阅管理系统ljr9i

根据日常实际需要&#xff0c;一方面需要在系统中实现基础信息的管理&#xff0c;同时还需要结合实际情况的需要&#xff0c;提供图书信息管理功能&#xff0c;方便图书管理工作的展开&#xff0c;综合考虑&#xff0c;本套系统应该满足如下要求&#xff1a; 首先&#xff0c;在…