标签：

要使 el-input 只能输入0-100以内的正整数，可以通过使用 el-form 和 el-form-item 来设置验证规则。以下是一个示例的代码：

<el-form :model="form" :rules="rules" ref="form">
  <el-form-item prop="amount" label="金额">
    <el-input v-model="form.amount" placeholder="请输入金额"></el-input>
  </el-form-item>
</el-form>

data() {
  return {
    form: {
      amount: ''
    },
    rules: {
      amount: [
        {
          pattern: /^(?:[1-9][0-9]?|100)$/,
          message: '请输入0-100之间的正整数',
          trigger: 'blur'
        }
      ]
    }
  }
}

在这个示例中，使用了 el-form 来包裹 el-input，并在 el-form-item 中设置了验证规则。

form 是用于存储表单数据的对象，其中的 amount 字段对应了输入金额的值。rules 是一个包含验证规则的对象，其中 amount 对应了 el-input 中的 v-model 绑定的数据。

在这个示例中，我们使用了正则表达式 /^(?:[1-9][0-9]?|100)$/ 来匹配0-100之间的正整数。message 是当验证不通过时显示的错误消息。

通过设置 trigger 为 'blur'，验证会在输入框失去焦点时触发，可以根据需要选择 'change' 或其他合适的触发时机。

标签：
来源：

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。