我如何覆盖 JSON 表单中的默认错误消息文本

Question

TLDR：我需要自定义 JSON 表单提供的默认错误消息。例如，如果字段是 required，则 JSON 形式给出错误 is a required property，我希望它是 return 错误消息文本，例如 Invalid input....

我创建了一个 JSON form 架构类似于

    {
    type: 'object',
    properties: {
        name: {
            type: 'string',
            minLength: 3,
        },
    },
    required: [
        'name',
    ],
    errorMessage: {
        required: 'INVALID INPUT. This is a required field',
    },
};

现在我已经使用这个架构和一个 UI 架构创建了一个 JSON 表单

const ajv = createAjv();
require('ajv-keywords')(ajv);
require('ajv-errors')(ajv);
<JsonForms
    schema={schema}
    uischema={uischema}
    data={data}
    renderers={CustomRenderers}
    cells={vanillaCells}
    onChange={onChange}
    ajv={ajv}
/>

上面的 JSON 表单呈现 UI 表单，当字段为空时给出标准错误消息，如 is a required property，现在我需要用我自己的自定义消息覆盖，为此，https://github.com/ajv-validator/ajv-errors 被发现很有用，并在我的架构中添加了属性 errorMessage，required 键包含我的自定义消息，我还添加了 require('ajv-errors')(ajv);是必需的，但我仍然收到默认错误消息，而不是我在 errorMessage.

中覆盖的错误消息

我是不是遗漏了什么？或者我可以用其他方法来覆盖默认消息。此外，与 required 一起，我将进行很多验证，例如 minLength、maxLength 等，我可能必须覆盖其默认消息。

此外，我希望架构中有很多其他属性，因此在每个属性中添加 errorMessage 可能不是很有效，但如果这是唯一的解决方案，我必须采用它:)

Answer 1

我继续添加了我自己的自定义关键字

export default (ajv) => {
    ajv.addKeyword('customErrorMessages', {
        inline: generate_customErrorMessages,
        statements: true,
        valid: true,
        errors: 'full',
    });
    return ajv;
};

const generate_customErrorMessages = () => {
    var out = ' ';
    out += "vErrors = vErrors.map((v) => {"
    out += "if (v.keyword === 'required') {v.message = 'This field cannot be left blank.';} ";
    out += "else if (v.keyword === 'minLength') {v.message = `This field cannot be shorter than ${v.params?.limit} characters.`;} ";
    out += "else if (v.keyword === 'maxLength') {v.message = `This field cannot be longer than ${v.params?.limit} characters.`;} ";
    out += "else if (v.keyword === 'maximum') {v.message = `This field should be ${v.params?.comparison} ${v.params?.limit}`;} ";
    out += "else if (v.keyword === 'minimum') {v.message = `This field should be ${v.params?.comparison} ${v.params?.limit}`;}";
    out += "return v;});"
    return out;
};

我还需要在我的架构中添加关键字 "customErrorMessages": true。有了这个，我的消息将成为代码的一部分而不是架构的一部分，我还可以为不同的语言添加不同的消息，而不必依赖于架构。

Answer 2

 {
type: 'object',
properties: {
    name: {
        type: 'string',
        minLength: 3,
    },
},
required: [
    'name',
],
"errorMessage": {
    "properties":{
           "name": 'INVALID INPUT. This is a required field'
      }
  
},

};

在 errorMessage 属性中，您应该在这种情况下提供属性“名称”以及您需要的自定义消息

我如何覆盖 JSON 表单中的默认错误消息文本

How can i override default error messages text in JSON forms

ajv

react-jsonschema-forms

jsonforms