element-ui switch 组件源码分享

news2024/11/24 16:46:07

今日简单分享 switch 组件源码,主要从以下四个方面来分享:

1、switch 组件的页面结构

2、switch 组件的属性

3、switch 组件的事件

4、switch 组件的方法

一、switch 组件的页面结构

二、switch 组件的属性

2.1 value / v-model 属性,绑定值,类型 boolean / string / number,无默认值。

2.2 disabled 属性,是否禁用,类型 boolean,默认 false。

2.3 width 属性,switch 的宽度(像素),类型 number,默认 40。

2.4 active-icon-class 属性,switch 打开时所显示图标的类名,设置此项会忽略 active-text类型

string,无默认值。

2.5 inactive-icon-class 属性,switch 关闭时所显示图标的类名,设置此项会忽略 inactive-text,类型 string,无默认值。

2.6 active-text 属性,switch 打开时的文字描述,类型 string,无默认值。

2.7 inactive-text 属性,switch 关闭时的文字描述,类型 string,无默认值。

2.8 active-value 属性,switch 打开时的值,类型 boolean / string / number,默认 true。

2.9 inactive-value 属性,switch 关闭时的值,类型 boolean / string / number,默认 false。

2.10 active-color 属性,switch 打开时的背景色,类型 string,默认 #409EFF。

2.11 inactive-color 属性,switch 关闭时的背景色,类型 string,默认 #C0CCDA。

2.12 name 属性,switch 对应的 name 属性,类型 string,无默认值。

2.14 validate-event 属性,改变 switch 状态时是否触发表单的校验,类型 boolean,默认 true。

三、switch 组件的事件

3.1 change 事件,switch 状态发生变化时的回调函数,新状态的值。

四、switch 组件的方法

4.1 focus 事件,使 Switch 获取焦点。

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

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

相关文章

基于Hive大数据分析springboot为后端以及vue为前端的的民宿系

标题基于Hive大数据分析springboot为后端以及vue为前端的的民宿系 本文介绍了如何利用Hive进行大数据分析,并结合Spring Boot和Vue构建了一个民宿管理系统。该民民宿管理系统包含用户和管理员登陆注册的功能,发布下架酒店信息,模糊搜索,酒店详情信息展示,收藏以及对收藏的…

SpringMVC源码分析(七)--数据绑定工厂

1.数据绑定工厂的使用 数据绑定工厂能够创建数据绑定器,将数据绑定到对象中,比如说当接收到请求时,经过http协议解析后数据刚开始都是字符串,此时我们希望将这些属性进行类型转换,并为对象赋值,示例如下: 1)先创建两个实体类Student和Teacher @Getter @Setter @ToSt…

封装性练习

练习 1 : 创建程序:在其中定义两个类: Person 和 PersonTest 类。定义如下: 用 setAge() 设置人的合法年龄 (0~130) ,用 getAge() 返回人的年龄。在 PersonTest 类中实例化 Person 类的对象 b ,调用 set…

Java八股文(算法)

Java八股文の算法 算法 算法 逆序输出字符串 题目描述:输入一个字符串,要求逆序输出。 public static String reverseString(String s) {StringBuilder sb new StringBuilder();for (int i s.length() - 1;i > 0;i--) {sb.append(s.charAt(i));}r…

基于多模态信息的语音处理(misp) 2023挑战:视听目标说话人提取

THE MULTIMODAL INFORMATION BASED SPEECH PROCESSING (MISP) 2023 CHALLENGE: AUDIO-VISUAL TARGET SPEAKER EXTRACTION 第二章 目标说话人提取之《基于多模态信息的语音处理(misp) 2023挑战:视听目标说话人提取》 文章目录 THE MULTIMODAL INFORMATION BASED SPEECH PROCESS…

MCU或者SOC常见驱动3:USART通信

MCU或者SOC常见驱动3:USART通信 本文目的前置知识点UART简介主要特性通信流程数据帧格式所有数据帧满足的格式特殊的帧和用处(不是很清楚对不对) 参考文献 本文目的 简单的介绍USART通信一下是什么,有什么用,以及相关…

鸿蒙OS开发实例:【窥探网络请求】

HarmonyOS 平台中使用网络请求,需要引入 "ohos.net.http", 并且需要在 module.json5 文件中申请网络权限, 即 “ohos.permission.INTERNET” 本篇文章将尝试使用 ohos.net.http 来实现网络请求 场景设定 WeiBo UniDemo HuaWei : 请求顺序WeiBo1 UniDem…

同元软控专业模型库系列——液压气动篇

01 引言 近年来,数字液压技术在工业领域的应用逐渐推广,为提升生产效率、降低能源消耗、实现智能化制造提供了新的可能性。数字液压技术的应用已经覆盖了工程机械、航空航天、能源设备等众多领域,具有巨大的发展潜力。 行业技术的发展融合在…

机器人码垛机:智能仓储系统的重要组成部分

随着科技的飞速进步,机器人技术已经渗透到了许多行业领域,其中,仓储业尤为显著。机器人码垛机作为智能仓储系统的重要组成部分,不仅提高了码垛效率,还降低了人工成本和安全风险。然而,在其广泛应用的同时&a…

C# OpenCvSharp-HoughCircles(霍夫圆检测) 简单计数

目录 效果 项目 代码 下载 效果 项目 代码 using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Windows.Forms; using OpenCvSharp; using O…

pycharm复习

1.字面量 2.注释: 单行注释# 多行注释" " " " " " 3.变量: 变量名 变量值 print:输出多个结果,用逗号隔开 4.数据类型: string字符串int整数float浮点数 t…

WebSocket 详解-小案例展示

简介:Websocket是一种用于H5浏览器的实时通讯协议,可以做到数据的实时推送,可适用于广泛的工作环境,例如客服系统、物联网数据传输系统,该测试工具可用于websocket开发初期的测试工作。 文章末尾有此案例的完整源代码。…

Arcgis中使用NDVI阈值法提取农田shape

首先有一幅NDVI影像TIFF,对其查看农田上的NDVI范围,大概是0.1以上,因为是12月份,小麦播种完1-2个月,此时NDVI并不是很高,但是树林基本叶子掉落了,所以比较好提取农田。 打开地图代数-栅格计算器…

【漏洞分析】浅析android手游lua脚本的加密与解密(一)

主要用到的工具和环境: 1 win7系统一枚 2 quick-cocos2d-x的开发环境(弄一个开发环境方便学习,而且大部分lua手游都是用的cocos2d-x框架,还有一个好处,可以查看源码关键函数中的特征字符串,然后在IDA定位到…

选择华为HCIE培训机构有哪些注意事项

选择软件培训机构注意四点事项1、口碑:学员和社会人士对该机构的评价怎样? 口碑对于一个机构是十分重要的,这也是考量一个机构好不好的重要标准,包括社会评价和学员的评价和感言。誉天作为华为首批授权培训中心,一直致…

【计算机考研】数学难,到底难在哪里?看这一篇深度分析

数一和数二的难度系数都不在一个重量级! 数一这货,容量真不是数二能比的!除了高数、线代这些常规操作,还要啃概率论与数理统计这本大厚书,简直是让人头大! 考研数学嘛,大家都知道,…

【详细讲解Android Debug Bridge各种命令及用法的文章】

🔥博主:程序员不想YY啊🔥 💫CSDN优质创作者,CSDN实力新星,CSDN博客专家💫 🤗点赞🎈收藏⭐再看💫养成习惯 🌈希望本文对您有所裨益,如有…

微服务demo(四)nacosfeigngateway

一、gateway使用: 1、集成方法 1.1、pom依赖: 建议:gateway模块的pom不要去继承父工程的pom,父工程的pom依赖太多,极大可能会导致运行报错,新建gateway子工程后,pom父类就采用默认的spring-b…

算法——动态规划:01背包

原始01背包见下面这篇文章:http://t.csdnimg.cn/a1kCL 01背包的变种:. - 力扣(LeetCode) 给你一个 只包含正整数 的 非空 数组 nums 。请你判断是否可以将这个数组分割成两个子集,使得两个子集的元素和相等。 简化一…

HTML input 实现回车切换到下一个输入框功能

前言 遇到需求&#xff0c;在客户填写单子时&#xff0c;有多个输入框&#xff0c;为了省事&#xff0c;不需要频繁移动光标填写。 实现效果 实现方式一 HTML <input type"text" name"serialNumber1" onkeydown"cursor(this);"/><in…