component={renderField} no longer triggers change

I think this may be related to the other issues regarding the new? changes to the onChange handler, but ‘all of a sudden’, the fields on all my forms stopped working.

I’m using the renderField for synchronous validation and if I change the atttribute back to component=“text”, it works fine.

Here is my renderField function:

    const renderField = ({ input, opts, type, placeholder, className, meta: { touched, error } }) => (
        <div>
          <input {...input} {...opts} type={type} placeholder={placeholder} className={className}/>
          {touched && ( error && <span className="gt-error"><i className="fa fa-exclamation-circle" /> {error}</span>)}
        </div>
    );

And I call it with:

<Field opts={opts} name={props.controlId} component={renderField} type={type} className="form-control" placeholder={props.placeholder}/>

[MrRoyce]

The problem was I had renderField defined as a constant inside a generic reusable ‘Text’ component. When I moved the renderField out of the component. It works fine. Closing.

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.