【VUE实战问题记录】只能输入0-100（包括两位小数及0和100）正则表达式

正则表达式是对字符串操作的一种逻辑公式，就是用事先定义好的一些特定字符、及这些特定字符的组合，组成一个“规则字符串”，这个“规则字符串”用来表达对字符串的一种过滤逻辑。

本文就是为了纪录在项目中用到的正则表达式，方便后期使用查阅。

正则表达式：校验只能输入0-100（包括两位小数及0和100）

代码如下：

    // 只能输入0-100（包括两位小数及0和100）const validateNumber = (str) => {return new RegExp('(^(\\d|[1-9]\\d)(\\.\\d{1,2})?$)|(^100$)').test(str)}

使用方法：

  data() {return {rules: {proportion: [{ required: true, message: '请输入XXX金额', trigger: 'blur' },{validator: (rule, value, callback) => {if (!validateNumber(value)) {return callback(new Error('请输入0-100的自然数,最多两位小数'))} else {return callback()}},trigger: 'blur',},],},}}

布局中使用方法：

      <el-form-item label="XXX金额" prop="proportion"><el-inputstyle="width: 240px"v-model="formData.proportion"clearableplaceholder="请输入0到100的数字,最多两位小数"></el-input><span style="margin-left: 10px">{{ '元' }}</span></el-form-item>

其中formData.proportion为绑定的数据，prop="proportion"实时把数据传递给我们表单的校验规则，做校验。

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！