首页 > 其他分享 >element 表单规则所有属性中文(el-from rules)

element 表单规则所有属性中文(el-from rules)

时间:2023-08-10 13:56:31浏览次数:51  
标签:el string rules true required value element validator type

Rules

Rules may be functions that perform validation.

function(rule, value, callback, source, options)
  • rule: Object

    {
        "field": "name", // 检查的属性的名
        "fullField": "name", // 
        "type": "string", // 类型默认 string
        "validator": "ƒ" // 检查的函数
    }
    
  • value: 用户输入的值

  • callback:验证完成后调用的回调函数。它期望传递一个' Error '实例数组来指示验证失败。如果检查是同步的,则可以直接返回' false '或' Error '或' Error Array '。

  • source: 传递给“validate”方法的源对象。

  • options:额外选项,.

    {
        "firstFields": true,
        "messages": {
            "default": "Validation error on field %s",
            "required": "%s is required",
            "enum": "%s must be one of %s",
            "whitespace": "%s cannot be empty",
            "date": {
                "format": "%s date %s is invalid for format %s",
                "parse": "%s date could not be parsed, %s is invalid ",
                "invalid": "%s date %s is invalid"
            },
            "types": {
                "string": "%s is not a %s",
                "method": "%s is not a %s (function)",
                "array": "%s is not an %s",
                "object": "%s is not an %s",
                "number": "%s is not a %s",
                "date": "%s is not a %s",
                "boolean": "%s is not a %s",
                "integer": "%s is not an %s",
                "float": "%s is not a %s",
                "regexp": "%s is not a valid %s",
                "email": "%s is not a valid %s",
                "url": "%s is not a valid %s",
                "hex": "%s is not a valid %s"
            },
            "string": {
                "len": "%s must be exactly %s characters",
                "min": "%s must be at least %s characters",
                "max": "%s cannot be longer than %s characters",
                "range": "%s must be between %s and %s characters"
            },
            "number": {
                "len": "%s must equal %s",
                "min": "%s cannot be less than %s",
                "max": "%s cannot be greater than %s",
                "range": "%s must be between %s and %s"
            },
            "array": {
                "len": "%s must be exactly %s in length",
                "min": "%s cannot be less than %s in length",
                "max": "%s cannot be greater than %s in length",
                "range": "%s must be between %s and %s in length"
            },
            "pattern": {
                "mismatch": "%s value %s does not match pattern %s"
            }
        }
    }
    

Type

Indicates the type of validator to use. Recognised type values are:

  • string: 字符串 string. 默认类型.
  • number: 数字.
  • boolean:布尔.
  • method: 方法.
  • regexp:正则
  • integer:是数字并且是整型.
  • float: 是数字并且是浮点型.
  • array: 数组.
  • object:对象.
  • enum: 规定类型,['red','blue','black'].
  • date: 时间
  • url: url.
  • hex: 16进制.
  • email: 邮件.
  • any:不控制.

Required

是否必填

Pattern

自定义校验规则正则表达式

Range

区间控制

min:最小

max:最大

Length

len:长度

Enumerable

要从可能的值列表中验证一个值,使用' enum '类型和' enum '属性列出该字段的有效值,例如:

const descriptor = {
  role: { type: 'enum', enum: ['admin', 'user', 'guest'] },
};

Whitespace

全字段通常将只包含空格的必填项视为错误。要对仅由空格组成的字符串添加额外的测试,请给规则添加一个值为truewhitespace属性。规则必须是string类型。

Deep Rules

验证深层对象属性,你可以通过将嵌套规则分配给规则的' fields '属性来验证' object '或' array '类型的验证规则。

const descriptor = {
  address: {
    type: 'object',
    required: true,
    fields: {
      street: { type: 'string', required: true },
      city: { type: 'string', required: true },
      zip: { type: 'string', required: true, len: 8, message: 'invalid zip' },
    },
  },
  name: { type: 'string', required: true },
};
const validator = new Schema(descriptor);
validator.validate({ address: {} }, (errors, fields) => {
  // errors for address.street, address.city, address.zip
});

注意,如果你没有在父规则上指定“required”属性,那么在源对象上声明的字段是完全有效的,并且深度验证规则将不会被执行,因为没有任何东西可以验证。

深度规则验证为嵌套规则创建一个模式,所以你也可以指定传递给' schema.validate() '方法的' options '。

const descriptor = {
  address: {
    type: 'object',
    required: true,
    options: { first: true },
    fields: {
      street: { type: 'string', required: true },
      city: { type: 'string', required: true },
      zip: { type: 'string', required: true, len: 8, message: 'invalid zip' },
    },
  },
  name: { type: 'string', required: true },
};
const validator = new Schema(descriptor);

validator.validate({ address: {} })
  .catch(({ errors, fields }) => {
    // now only errors for street and name    
  });

父规则也会被验证,所以如果你有一组规则,比如:

const descriptor = {
  roles: {
    type: 'array',
    required: true,
    len: 3,
    fields: {
      0: { type: 'string', required: true },
      1: { type: 'string', required: true },
      2: { type: 'string', required: true },
    },
  },
};

并提供一个源对象 { roles: ['admin', 'user'] }此时会有两个判断.一个是数组长度,一个数数组中的值判断

defaultField

' defaultField '属性可以与' array '或' object '类型一起使用,用于验证容器的所有值。

它可以是包含验证规则的“对象”或“数组”。例如:

const descriptor = {
  urls: {
    type: 'array',
    required: true,
    defaultField: { type: 'url' },
  },
};

Transform

如果需要在验证之前转换值。使用这个规则.。这个方法在验证之前运行

import Schema from 'async-validator';
const descriptor = {
  name: {
    type: 'string',
    required: true,
    pattern: /^[a-z]+$/,
    transform(value) {
      return value.trim();
    },
  },
};
const validator = new Schema(descriptor);
const source = { name: ' user  ' };

validator.validate(source)
  .then((data) => assert.equal(data.name, 'user'));

validator.validate(source,(errors, data)=>{
  assert.equal(data.name, 'user'));
});

Messages

报错信息

{ name: { type: 'string', required: true, message: 'Name is required' } }
{ name: { type: 'string', required: true, message: '<b>Name is required</b>' } }
{ name: { type: 'string', required: true, message: () => this.$t( 'name is required' ) } }

如果需要对不同的语言使用相同的模式验证规则,在这种情况下,为每种语言复制模式规则是没有意义的。

在这种情况下,你可以为语言提供你自己的消息,并将其分配给模式:

import Schema from 'async-validator';
const cn = {
  required: '%s 必填',
};
const descriptor = { name: { type: 'string', required: true } };
const validator = new Schema(descriptor);
// deep merge with defaultMessages
validator.messages(cn);
...

定义自己的验证函数,最好的做法是将消息字符串分配给消息对象,然后通过' options '访问消息。消息属性在验证函数中。

asyncValidator

指定的字段自定义异步验证功能:

const fields = {
  asyncField: {
    asyncValidator(rule, value, callback) {
      ajax({
        url: 'xx',
        value: value,
      }).then(function(data) {
        callback();
      }, function(error) {
        callback(new Error(error));
      });
    },
  },

  promiseField: {
    asyncValidator(rule, value) {
      return ajax({
        url: 'xx',
        value: value,
      });
    },
  },
};

validator

您可以为指定字段自定义验证函数:

const fields = {
  field: {
    validator(rule, value, callback) {
      return value === 'test';
    },
    message: 'Value is not equal to "test".',
  },

  field2: {
    validator(rule, value, callback) {
      return new Error(`${value} is not equal to 'test'.`);
    },
  },
 
  arrField: {
    validator(rule, value) {
      return [
        new Error('Message 1'),
        new Error('Message 2'),
      ];
    },
  },
};

标签:el,string,rules,true,required,value,element,validator,type
From: https://www.cnblogs.com/bozhiyao/p/17620132.html

相关文章

  • 获取除法的整数部分;获取值的平方根,Excel全办到!
    1职场实例今天我们来利用Excel表格来解决两个关于数学取值的问题。问题1:返回商数的整数部分问题2:返回数值的平方根如下图所示:上图A列为被除数,B列为除数,我们想要在C列返回商(被除数÷除数)的整数部分。下图A列为一列数值,我们想要在B列得到返回A列数值的平方根。2解题思路今天的这两个......
  • ViewModel
    一.视图和数据模型之间的桥梁ViewModel在页面(Activity/Fragment)功能较为简单的情况下,通常会把UI交互,与数据获取等相关的业务逻辑全部写在页面中。但是在页面功能复杂的情况下,这样做是不合适的,因为它不符合“单一功能原则”。页面应该只负责处理用户和UI控件的交互,并将数据......
  • 使用在线Excel时,有哪些方法可以引入计算函数?
    摘要:本文由葡萄城技术团队于博客园原创并首发。转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。前言在日常生活和工作中,我们都会或多或少的使用Excel中的计算公式函数,比如求和公式、平均数公式等。今天为大家整理了一些在线Excel中可......
  • 基于Field_II_ver_3_24_windows_gcc工具箱的超声波二维成像与三维成像matlab仿真
    1.算法理论概述1.1超声波成像的基本原理       超声波成像是一种通过超声波对物体进行成像的技术。超声波成像的原理是利用超声波在不同组织之间传播速度不同的特点,探测物体内部的结构。超声波成像可以分为二维成像和三维成像两种。二维成像是将超声波探头沿一个方向......
  • 题解 [SDOI2009] Elaxia的路线
    题目链接题意简述:求两条给定起点终点最短路的最长公共路径。首先最长公共路径一定是两条最短路的公共最长链的部分。至少一定在两条最短路上。考虑如何求出一条路径是否包含于一条最短路,只要路径\(x\rightarrowy\)满足:\[dis_{st\rightarrowx}+w_{x\rightarrowy}+dis_{y\r......
  • 监控Elasticsearch的关键指标
    Elasticsearch的核心职能就是对外提供搜索服务,所以搜索请求的吞吐和延迟是非常关键的,搜索是靠底层的索引实现的,所以索引的性能指标也非常关键,Elasticsearch由一个或多个节点组成集群,集群自身是否健康也是需要我们监控的。lasticSearch的架构非常简单,一个节点就可以对外提供服务,......
  • 【IntelliJ IDEA插件】值得推荐的Idea几十大优秀插件、神级超级牛逼插件推荐(自用,真的
    本文目录一、提高效率级插件1、Lombok--简化Java代码开发2、FreeMybatisplugin--mybatisxml和对应的mapper之间来回切换3、GrepConsole--控制台日志高亮4、MybatisLogPlugin--显示完整sql5、CodeGlance--缩略图6、.ignore--提交代码时自动忽略不需要提交的文件......
  • 如何利用PowerShell来监控一个进程中的线程数
    如何利用PowerShell来监控一个进程实际产生了多少个线程$processName="chrome.exe"$process=Get-WmiObject-Query"SELECT*FROMWin32_ProcessWHEREName='$processName'"$threadCount=$process.ThreadCountWrite-Host"Thenumberofthreadsin......
  • sudo apt update 报错:库 “https://download.docker.com/linux/ubuntu \ Release”
    sudoaptupdate报错:错误:10https://download.docker.com/linux/ubuntu\Release404NotFound[IP:143.204.126.13443]命中:11http://ppa.launchpad.net/rock-core/qt4/ubuntufocalInRelease命中:12https://dl.google.com/linux/chrome/debstableInRelease正......
  • 条条大路通罗马系列—— 使用 Hiredis-cluster 连接 Amazon ElastiCache for Redis 集
    前言AmazonElastiCacheforRedis是速度超快的内存数据存储,能够提供亚毫秒级延迟来支持实时应用程序。适用于Redis的ElastiCache基于开源Redis构建,可与RedisAPI兼容,能够与Redis客户端配合工作,并使用开放的Redis数据格式来存储数据。适用于Redis的ElastiCache......