EFrom.js

import React from "react";

export default function (Comp) {
    return class newComp extends React.Component {
        constructor(props) {
            super(props);
            this.state = {}
            this.rules = {}
        }

        handleChange = (e) => {
            let {name, value} = e.target
            this.setState({
                [name]: value
            }, () => {
                this.validateInput(name)
            })
        }

        setRule = (key, rule, InputComp) => {
            console.log(key, rule, InputComp)
            this.rules[key] = rule
            const suffix = this.state[key] ? <Icon type={"close-circle"} onClick={() => this.emitEmpty(key)}/> : null
            return <div className={'demo-input'}>
                <p style={{color: 'red'}}>{this.state[key + 'Message']}</p>
                {React.cloneElement(InputComp, {
                    suffix,
                    name: key,
                    value: this.state[key],
                    onChange: this.handleChange,
                })}
            </div>
        }

        validateInput(key) {
            let rule = this.rules[key]
            rule = Array.isArray(rule) ? rule : [rule]
            return rule.some(r => {
                if (r.required) {
                    if (!this.state[key]) {
                        this.setState({
                            [key + 'Message']: r.message
                        })
                        return true
                    } else {
                        this.setState({
                            [key + 'Message']: ''
                        })
                    }
                }
                if (r.min) {
                    if (this.state[key].length < r.min) {
                        this.setState({
                            [key + 'Message']: r.message
                        })
                        return true
                    } else {
                        this.setState({
                            [key + 'Message']: ''
                        })
                    }
                }
            })
        }

        validate = () => {
            let ret = Object.keys(this.rules).map(r => {
                console.log('validate r', r)
                return this.validateInput(r)
            })
            console.log('validate', ret)
            return ret.some(r => !r)
        }

        render() {
            return <Comp {...this.props} name='123' evalidate={this.validate} erules={this.setRule}/>
        }
    }
}

使用:
login.js

@EForm
class Login extends React.Component {
    constructor(props) {
        super(props);
    }

    handleSubmit = () => {
        if (this.props.evalidate()) {
            nprogress.start()
            nprogress.set(0.4)
            setTimeout(() => {
                nprogress.done()
            }, 3000)
        }
    }

    render() {
        return (
            <div className={styles.login} data-name={this.props.name}>
                {this.props.erules('username', [
                        {required: true, message: '请输入用户名'},
                        {min: 5, message: '用户名长度不得少于5'}
                    ],
                    <Input
                        placeholder="Enter your username"
                        prefix={<Icon type="user"/>}
                    />
                )}
                {this.props.erules(
                    'passwd',
                    {required: true, message: '请输入密码'},
                    <Input
                        type='password'
                        placeholder="Enter your password"
                        prefix={<Icon type="lock"/>}
                    />
                )}
                <div className={styles.submit}>
                    <Button type='primary' block onClick={this.handleSubmit}>登录</Button>
                </div>
            </div>

        )
    }

}

export default Login;