欢迎访问 生活随笔!

生活随笔

当前位置: 首页 > 编程资源 > 编程问答 >内容正文

编程问答

elementui-input限制输入正整数

发布时间:2023/12/20 编程问答 36 豆豆
生活随笔 收集整理的这篇文章主要介绍了 elementui-input限制输入正整数 小编觉得挺不错的,现在分享给大家,帮大家做个参考.
<!-- 正整数 --> <el-form-item prop="total" label="发行量"><el-input v-model.number="form.total" placeholder="发行量" onkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')"/> </el-form-item><!-- 0和正整数 --> <el-input v-model.number="form.order" placeholder="排序" onkeyup="value=value.replace(/[^\d]+/g,'')"/><!-- 金额,保留两位小数 --> <el-form-item prop="min_price" label="最低使用价格"><el-input-number v-model.number="form.min_price" placeholder="最低使用价格" type="number" :precision="2"/> </el-form-item> // 表单校验rules: {mgGoodsId: [{required: true, message: '请输入商品id', trigger: 'blur'}],mgOrder: [{required: true, message: '请输入排序', trigger: 'change'},{validator: (rule, value, callback) => {if (value < 0) {callback(new Error('需要大于0'))} else if (value > 10000000) {callback(new Error('需要小于10000000'))} else {callback()}},trigger: 'blur'}],}

校验输入框内容

<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body><el-form ref="form" :model="form" :rules="rules" label-width="80px"><el-form-item label="物流公司" prop="logisticsCompany"><el-input v-model="form.logisticsCompany" placeholder="请输入物流公司" oninput="value=value.replace(/[^\w\u4E00-\u9FA5]/g, '')" /></el-form-item><el-form-item label="物流单号" prop="logisticsCode"><el-input v-model="form.logisticsCode" placeholder="请输入物流单号" oninput="value=value.replace(/[^\w]/g,'')" /></el-form-item><el-form-item label="备注" prop="remark"><el-input v-model="form.remark" placeholder="备注" /></el-form-item></el-form><div slot="footer" class="dialog-footer"><el-button type="primary" @click="submitForm">确 定</el-button><el-button @click="cancel">取 消</el-button></div></el-dialog> oninput用正则结合elementui // 表单校验rules: {logisticsCompany: [{ required: true, message: "物流公司不能为空", trigger: "blur" },{min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur'}],logisticsCode: [{ required: true, message: "物流单号不能为空", trigger: "blur" },{min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur'}],remark: [{min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur'}]},

更多正则

总结

以上是生活随笔为你收集整理的elementui-input限制输入正整数的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。