当前位置: 首页 > news >正文

uniapp动态循环表单校验失败:初始值校验

问题现象 💥

在实现动态增减的单价输入表单时(基于uv-form组件),遇到以下诡异现象:

  • <uv-input>的v-model绑定初始值为数字类型时,required规则失效 ❌
  • 数字类型与字符串类型校验表现不一致 🔢

技术栈背景 🛠️

  • 框架:Vue3 + uni-app
  • UI库:uv-ui
  • 校验方案:计算属性动态生成规则

示意图 🔍

在这里插入图片描述

解决方案 🚀

1.优先使用字符串类型做表单绑定
2.添加自定义校验规则(validator)解决初始值问题

<template><view class="form-box"><uv-form ref="refForm" :model="formvalue" labelWidth="100px" :rules="rules"><view class="form-list-item" v-for="(item, index) in formvalue.detailList" :key="index"><uv-form-item borderBottom label="单价" :prop="`detailList.${index}.amount`" required><uv-input inputAlign="right" type="digit" v-model="item.amount" placeholder="请输入单价" border="none"><template v-slot:suffix></template></uv-input></uv-form-item>&

http://www.mrgr.cn/news/95975.html

相关文章:

  • 解决Spring Cloud OpenFeign端点未暴露问题
  • Modbus RTU ---> Modbus TCP透传技术实现(Modbus透传、RS485透传、RTU透传)分站代码实现、协议转换器
  • 反序列化漏洞
  • Docker+Ollama+Xinference+RAGFlow+Dify部署及踩坑问题
  • msyql--基本操作之运维篇
  • 【JavaSE】抽象类和接口
  • uniapp页面列表,详情返回不刷新,新增或编辑后返回刷新
  • mysql中show命令的使用
  • NodeJs之fs模块
  • 【408--复习笔记】计算机组成原理
  • 【模型压缩+推理加速】知识蒸馏综述解读
  • 嵌入式硬件工程师从小白到入门-原理图(三)
  • ofd转pdf报错:org.ofdrw.reader.ZipUtil.unZipFileByApacheCommonCompress【已解决】
  • 语言模型理论基础-持续更新-思路清晰
  • Vue 2 探秘:visible 和 append-to-body 是谁的小秘密?
  • Brainstorm绘制功能连接图(matlab)
  • vue - [Vue warn]: Duplicate keys detected: ‘0‘. This may cause an update error.
  • 第六篇:Setup:组件渲染前的初始化过程是怎样的?
  • 【Linux】交叉编译2
  • OpenCV图像拼接(5)图像拼接模块的用于创建权重图函数createWeightMap()