amis表单较验

amis在前端做表单校验,无法按业务要求做复杂的校验功能,比如多个字段关联校验等,可以使用后台较验的方式。

引用文档:

amis - 低代码前端框架

1、基本的较验:

validations配置好表达式,然后在validationErrors配置好相应的错误提示。

表达式:amis - 低代码前端框架

XML 复制代码
{
	"name": "serialno",
	"label": "流水号",
	"id": "u:6d9986f4a89a",
	"type": "input-text",
	"required": true,
	"validations": {
		"minLength": 25,
		"maxLength": 50
	},
	"validationErrors": {
		"minLength": "流水号长度不对",
        "maxLength": "流水号太长了"
	}
}

2、组合的较验:

XML 复制代码
{
  "type": "page",
  "body": {
    "type": "form",
    "api": "/amis/api/form/saveForm",
    "rules": [
      {
        "rule": "!(data.a && data.b)",
        "message": "a 和 b 不能同时有值"
      }
    ],
    "body": [
      {
        "type": "input-text",
        "name": "a",
        "label": "A"
      },
      {
        "type": "input-text",
        "name": "b",
        "label": "B"
      }
    ]
  }
}

3、后台较验:

后端api接口,在提交参数中,按业务逻辑判断多个字段,只需返回如下格式:

XML 复制代码
{
     "status": -1,
     "errors": {
        "serialno":  "流水号格式出错"   
     }
}

前端就会定位【serialno】这个字段,并提交相应的错误。

结论:结合3种较验方式,如果简单较验,直接在前端配置即可,减少后台API调用;如果复杂较验,前端无法支持,可以先将参数提交后端,检验后再返回到前端报错。

相关推荐
前端不太难1 天前
没有文档模型,HarmonyOS PC 应用会发生什么?
华为·状态模式·harmonyos
GatiArt雷1 天前
Libvio.link网站反爬机制深度剖析与合规爬虫策略研究
状态模式
Go_Zezhou1 天前
render快速部署网站和常见问题解决
运维·服务器·开发语言·python·github·状态模式
共享家95271 天前
搭建 AI 聊天机器人:”我的人生我做主“
前端·javascript·css·python·pycharm·html·状态模式
We1ky2 天前
从零到一:我的javascript记忆翻转卡牌游戏诞生记
状态模式
Elieal2 天前
Spring MVC 全局异常处理实战
spring·mvc·状态模式
Elieal2 天前
统一 JSON 格式,JacksonObjectMapper 定制 Spring Boot JSON 转换规则
spring boot·json·状态模式
前端不太难2 天前
HarmonyOS PC 应用,先做文档模型
华为·状态模式·harmonyos
前端不太难2 天前
HarmonyOS 走向 PC,应用模型正在重构
重构·状态模式·harmonyos
进击的小头3 天前
行为型模式:状态模式——嵌入式状态管理的优雅解决方案
c语言·状态模式