Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] <FormField通过Rules配置的required校验无法显示错误信息> #2665

Open
1 task done
drinkmooon opened this issue Jan 7, 2025 · 0 comments
Open
1 task done

Comments

@drinkmooon
Copy link

Is there an existing issue for this?

  • I have searched the existing issues

Which Component

Form

Semi Version

官方文档版本(2.72.1)

Current Behavior

https://semi.design/zh-CN/input/form#%E9%85%8D%E7%BD%AE%E5%88%9D%E5%A7%8B%E5%80%BC%E4%B8%8E%E6%A0%A1%E9%AA%8C%E8%A7%84%E5%88%99
打开semi文档的表单组件,浏览“配置初始值与校验规则”部分。

  1. 点击提交,表单shortcut项报错: should be semi
    image

  2. 选中表单name项的输入框,并清除内容
    image

  3. 编辑shortcut项为semi,报错内容消失。
    image

  4. 点击提交,表单无反应
    image

Expected Behavior

第4步点击提交时,name字段下方提示错误信息: required error

Steps To Reproduce

上方现状部分已介绍清楚

ReproducibleCode

// 粘贴自官方文档
import React from 'react';
import { Form, Button } from '@douyinfe/semi-ui';

() => {
    
    const initValues = {
        name: 'semi',
        shortcut: 'se'
    };
    
    const style = { width: '100%' };
    
    const { Select, Input } = Form;

    return (
        <Form initValues={initValues} onSubmit={(values)=>{console.log('values', values)}}>
            <Input
                field="name"
                style={style}
                trigger='blur'
                rules={[
                    { required: true, message: 'required error' },
                    { type: 'string', message: 'type error' },
                    { validator: (rule, value) => value === 'semi', message: 'should be semi' },
                    { validator: (rule, value) => value && value.startsWith('se'), message: 'should startsWith se' }
                ]}
            />
            <Input
                field="shortcut"
                style={style}
                stopValidateWithError
                rules={[
                    { required: true, message: 'required error' },
                    { type: 'string', message: 'type error' },
                    { validator: (rule, value) => value === 'semi', message: 'should be semi' },
                    { validator: (rule, value) => value && value.startsWith('se'), message: 'should startsWith se' }
                ]}
            />
            <Button htmlType='submit'>提交</Button>
        </Form>
    );
};

Environment

- OS: MacOS Ventura
- browser: Chrome

Anything else?

No response

@drinkmooon drinkmooon changed the title [BUG] <FormField通过Rules配置的required校验无法显示错误message> [BUG] <FormField通过Rules配置的required校验无法显示错误信息> Jan 7, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant