【element-ui】输入框组件el-input输入数字/输出Number类型:type=“number“、v-model.number用法

news/2025/3/26 7:50:34/

输入框组件el-input输入数字/输出Number类型

1、基础用法

  • 输入:任何文本 → 输出:String类型
<el-input v-model="inputText"></el-input>
<!-- 
输入 abc —— inputText输出 "abc"
输入 123 —— inputText输出 "123"
输入 a1b2c3 —— inputText输出 "a1b2c3"
-->

2、type="number"

  • 输入:仅限数字 → 输出:String类型
<el-input type="number" v-model="inputText"></el-input>
<!-- 
输入 abc —— inputText输出 ""
输入 123 —— inputText输出 "123"
输入 a1b2c3 —— inputText输出 "123"
-->

3、.number

  • 输入:全数字 → 输出:Number类型
  • 输入:其他文本 → 输出:String类型
<el-input v-model.number="inputText"></el-input>
<!-- 
输入 abc —— inputText输出 "abc"
输入 123 —— inputText输出 123
输入 a1b2c3 —— inputText输出 "a1b2c3"
-->

4、type="number" + .number

  • 输入:仅限数字 → 输出:Number类型
<el-input type="number" v-model.number="inputText"></el-input>
<!-- 
输入 abc —— inputText输出 ""
输入 123 —— inputText输出 123
输入 a1b2c3 —— inputText输出 123
-->

http://www.ppmy.cn/news/1346596.html

相关文章

[译]一种基于模块联邦的插件前端

原文&#xff1a;https://malcolmkee.com/blog/a-plugin-based-frontend-with-module-federation/ 在谈及模块联邦及其独立构建和部署的特性&#xff08;通常称为微前端&#xff09;时&#xff0c;一个常见的问题是&#xff0c;“为什么这比使用iframe更好&#xff1f;”虽然这…

云计算关键技术

目录 一、云计算关键技术概述 1.1 概述 二、关键技术内容 2.1 虚拟化技术 2.2 分布式数据存储技术 2.3 资源管理技术 2.4 云计算平台管理技术 2.5 多租户隔离技术 2.5.1 多租户技术下SaaS 特征 2.5.2 多租户技术面临的技术难题 2.5.2.1 数据隔离 2.5.2.2 客户化配置…

ThinkPad X201 经典小黑 折腾玩

前段时间&#xff0c;在折腾ThinkPad T430时&#xff0c;偶然看到了ThinkPad X200&#xff0c;一个12.1英寸的高端便携小本。 想当年&#xff0c;但那是总裁级别才能用的&#xff0c;应该是接近2万元&#xff0c;我们是一直用DELL的。 没想到的是&#xff0c;在海鲜市场上&am…

大数据深度学习卷积神经网络CNN:CNN结构、训练与优化一文全解

文章目录 大数据深度学习卷积神经网络CNN&#xff1a;CNN结构、训练与优化一文全解一、引言1.1 背景和重要性1.2 卷积神经网络概述 二、卷积神经网络层介绍2.1 卷积操作卷积核与特征映射卷积核大小多通道卷积 步长与填充步长填充 空洞卷积&#xff08;Dilated Convolution&…

创建一个Vue项目(含npm install卡住不动的解决)

目录 1 安装Node.js 2 使用命令提示符窗口创建Vue 2.1 打开命令提示符窗口 2.2 初始Vue项目 2.2.1 npm init vuelatest 2.2.2 npm install 3 运行Vue项目 3.1 命令提示符窗口 3.2 VSCode运行项目 1 安装Node.js 可以看我的这篇文章《Node.js的安装》 2 使用命令提示…

1.0 Zookeeper 分布式配置服务教程

ZooKeeper 是 Apache 软件基金会的一个软件项目&#xff0c;它为大型分布式计算提供开源的分布式配置服务、同步服务和命名注册。 ZooKeeper 的架构通过冗余服务实现高可用性。 Zookeeper 的设计目标是将那些复杂且容易出错的分布式一致性服务封装起来&#xff0c;构成一个高…

《动手学深度学习(PyTorch版)》笔记7.2

注&#xff1a;书中对代码的讲解并不详细&#xff0c;本文对很多细节做了详细注释。另外&#xff0c;书上的源代码是在Jupyter Notebook上运行的&#xff0c;较为分散&#xff0c;本文将代码集中起来&#xff0c;并加以完善&#xff0c;全部用vscode在python 3.9.18下测试通过&…

由vscode自动升级导致的“终端可以ssh服务器,但是vscode无法连接服务器”

问题描述 简单来说就是&#xff0c;ssh配置没动&#xff0c;前两天还可以用vscode连接服务器&#xff0c;今天突然就连不上了&#xff0c;但是用本地终端ssh可以顺利连接。 连接情况 我的ssh配置如下&#xff1a; Host gpu3HostName aaaUser zwx现在直接在终端中进行ssh&am…