element-ui inputNumber 组件源码分享

今日简单分享 inputNumber 组件的实现原理,主要从以下四个方面来分享:

1、inputNumber 组件的页面结构

2、inputNumber 组件的属性

3、inputNumber 组件的事件

4、inputNumber 组件的方法

一、inputNumber 组件的页面结构。

二、inputNumber 组件的属性

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

2.2 min 属性,设置计数器允许的最小值,类型 number,默认值 -Infinity。

2.3 max 属性,设置计数器允许的最大值,类型 number,默认值 Infinity。

2.4 step 属性,计数器步长,类型 number,默认 1。

2.5 step-strictly 属性,是否只能输入 step 的倍数,类型 boolean,默认 false。

2.6 precision 属性,数值精度,类型 number,无默认值。


2.7 size 属性,计数器尺寸,类型 string,large, small,无默认值。

2.8 disabled 属性,是否禁用计数器,类型 boolean,默认 false。

2.9 controls 属性,是否使用控制,类型 boolean,默认 true。

2.10 controls-position 属性,控制按钮位置,类型 string,默认 right。

2.11 name 属性,原生属性,类型 string,无默认值。

2.12 label 属性,输入框关联的label文字,类型 string,无默认值。

2.13 placeholder 属性,输入框默认 placeholder,类型 string,无默认值。

三、inputNumber 组件的事件

3.1 change 事件,绑定值被改变时触发,currentValue, oldValue。

3.2 blur 事件,在组件 Input 失去焦点时触发,(event: Event)。

3.3 focus 事件,在组件 Input 获得焦点时触发,(event: Event)。

四、inputNumber 组件的方法

4.1 focus 事件,使 input 获得焦点。

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

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

相关文章

2024年MathorCup数学建模思路A题B题C题D题思路分享

文章目录 1 赛题思路2 比赛日期和时间3 组织机构4 建模常见问题类型4.1 分类问题4.2 优化问题4.3 预测问题4.4 评价问题 5 建模资料 1 赛题思路 (赛题出来以后第一时间在CSDN分享) https://blog.csdn.net/dc_sinor?typeblog 2 比赛日期和时间 报名截止时间:2024…

代码随想录算法训练营第二十四天(回溯1)|77. 组合(JAVA)

文章目录 回溯理论基础概念类型回溯模板 77. 组合解题思路源码 回溯理论基础 概念 回溯是递归的副产品,本质上是一种穷举 回溯解决的问题可以抽象为一种树形结构 类型 回溯主要用来解决以下问题 组合问题:N个数里面按一定规则找出k个数的集合切割问…

2024年水电站大坝安全监测工作提升要点

根据《水电站大坝运行安全监督管理规定》(国家发改委令第23号)和《水电站大坝运行安全信息报送办法》(国能安全〔2016〕261号)的相关规定、要求,电力企业应当在汛期向我中心报送每日大坝汛情。近期,全国各地…

动态内存管理+柔性数组

动态内存存在的意义 C语言是一种过程式编程语言,提供了底层访问能力和丰富的功能,广泛应用于操作系统、嵌入式系统、硬件驱动程序等领域。C语言的动态内存管理主要是通过malloc()、calloc()、realloc()和free()这几个标准库函数来实现的。 理解动态内存…

python实战之进阶篇(一)

定义类 1. 构造方法 2. 实例方法 3. 类方法 类似于Java中的静态方法, 使用方式: 类名.类方法 4. 私有变量 5. 私有方法 6. 使用属性set和get

【Vue3源码学习】— CH2.5 reactiveEffect.ts:Vue 3响应式系统的核心

reactiveEffect.ts:Vue 3响应式系统的核心 1. 什么是 reactiveEffect?2. 核心机制2.1 依赖收集(Track)2.2 触发更新(Trigger)2.3 效果范围(effectScope) 3. 源码解析 —— track3.1 …

正点原子imx6ull-mini不使用网络更新内核系统

参考视频:【【正点原子】Linux网络环境搭建篇】 参考文档:从正点原子官方下载 这几天在学imx6ull写网络驱动检测出网卡,但是一直ping不通ubuntu,电脑还有ubuntu、开发板都处于同一个网段,跟着正点原子的视频试了双网…

用 AI 编程-释放ChatGPT的力量

最近读了本书,是 Sean A Williams 写的,感觉上还是相当不错的。一本薄薄的英文书,还真是写的相当好。如果你想看,还找不到,可以考虑私信我吧。 ChatGPT for Coders Unlock the Power of AI with ChatGPT: A Comprehens…

计数器的原理和应用

一、计数器的原理和应用 要求&#xff1a;每计数三次&#xff0c;数码管值加一 #include<reg51.h> unsigned char s[]{0x3F,0x06,0x5B,0x4F,0x66,0x6D,0x7D,0x07,0x7F,0x6F}; unsigned char num0; void initcounter() {TMOD0x06;//0000 0110TH0256-3;TL0256-3;ET01;EA1;T…

java数据结构与算法刷题-----LeetCode34. 在排序数组中查找元素的第一个和最后一个位置

java数据结构与算法刷题目录&#xff08;剑指Offer、LeetCode、ACM&#xff09;-----主目录-----持续更新(进不去说明我没写完)&#xff1a;https://blog.csdn.net/grd_java/article/details/123063846 文章目录 二分查找 二分查找 解题思路&#xff1a;时间复杂度O( l o g 2 …

vue实现把Ox格式颜色值转换成rgb渐变颜色值(开箱即用)

图示&#xff1a; 核心代码&#xff1a; //将0x格式的颜色转换为Hex格式&#xff0c;并计算插值返回rgb颜色 Vue.prototype.$convertToHex function (colorCode1, colorCode2, amount) {// 确保输入是字符串&#xff0c;并检查是否以0x开头let newCode1 let newCode2 if (t…

五、基于KubeAdm搭建多节点K8S集群

如需查阅上一步骤,请点击下面链接:四、戴尔R630本地服务器Linux Centos7.9系统安装docker-ce-20.10.10-3.el7版本-CSDN博客文章浏览阅读727次,点赞12次,收藏13次。1、准备工作3、Linux Centos7.9系统的iDRAC远程管理、网络设置、SecureCRT远程登录终端、企业级静态ip地址配…