ant-design-vue form表单自定义校验规则

cpp 复制代码
 <a-form-item
                label="市场价"
                class="status-barcode"
                name="marketPrice"
                :rules="[
                  { required: true, message: '' },
                  { validator: validateNumber },
                ]"
              >
                <a-input
                  show-count
                  :maxlength="10"
                  v-model:value="formState.marketPrice"
                  placeholder="市场价"
                />
              </a-form-item>
cpp 复制代码
const objRegExp = {
  marketPrice: "市场价格",
};
const NumberRegCommodity = /^(?!0)\d{1,10}$/;
const validateNumber = (rule, value, callback) => {
  if (!value) {
    callback(`请填写${objRegExp[rule.field]}`);
    return;
  }
  if (!NumberRegCommodity.test(value)) {
    callback("仅限填写正数且首位不能为0");
  }
};
相关推荐
暗冰ཏོ几秒前
ECharts 前端图表开发全攻略:参数配置、项目实战与高级可视化资源整理
前端·vue.js·echarts·visual studio code
PILIPALAPENG3 分钟前
gh:终端里的GitHub总控台,AI时代的开发者神器
前端·人工智能·后端
橘猫走江湖5 分钟前
前端项目如何做 vibe coding
javascript·vue.js·架构
励志打工人跑跑5 分钟前
JWT 身份验证与授权实战
vue.js
用户059540174469 分钟前
Redis持久化踩坑实录:RDB+AOF混合持久化,竟会悄无声息丢数据?我用pytest+Docker复现了30次故障场景
前端·css
浮游本尊11 分钟前
项目全景 + 第一条完整后端链路
java·前端
小新11016 分钟前
vue架的网站修改端口
前端·javascript·vue.js
暗不需求18 分钟前
从零实现一个 Vue Todos 任务清单:深入响应式编程与组合式 API
前端·vue.js·面试
超绝大帅哥19 分钟前
TTFB, FP, FCP, LCP, CLS, INP,TBT, TTI性能指标
前端
用户17335980753722 分钟前
纯前端 PDF 处理避坑指南:5 个线上真实问题的解决方案
前端·javascript