前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >el-input 限制只能输入正整数

el-input 限制只能输入正整数

作者头像
GoodTime
发布2024-03-05 16:09:08
1.4K0
发布2024-03-05 16:09:08
举报

1、前端页面

代码语言:javascript
复制
<el-row :gutter="20">
	<el-col :span="20">
		<el-form-item label="数量" prop="quantity">
			<el-input
					  class="entity"
					  placeholder="请输入数量"
					  v-model="ruleForm.quantity"
					  size="mini"
					  clearable>
				<span slot="suffix" style="padding: 0 5px">个</span>
			</el-input>
		</el-form-item>
	</el-col>
</el-row>

2、规则验证

代码语言:javascript
复制
export default {
	data() {
		return {
			ruleForm: {
				quantity: "",
			},
			rules: {
				quantity: [{
					pattern: /^(([1-9]{1}\d*)|(0{1}))(\.\d{1,2})?$/,
					required: true,
					message: '请输入数量,且为正整数类型',
					trigger: 'blur'
				}, ],
			},
		};
	},

若本文有帮助到阅读本文的同学,欢迎点赞、关注、收藏,互相学习交流。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2024-03-05,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1、前端页面
  • 2、规则验证
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档