react-validation
react-validation copied to clipboard
Error creating custom components
I received the following error attempting to create a new custom component.
Warning: Failed child context type: Invalid child context components.test of type CustomInput supplied to Form, expected instance of Base.
So I got this trying to follow the instructions on the Readme.md file so I decided to try and create a copy of the an email input by finding the code for it in the libs/components folder.
Note I'm using typescript
import * as React from 'react';
import { inputFactory } from 'react-validation/lib/build/validation.rc';
class ValidatableComponent extends React.Component<any, any> {
render() {
const { containerClassName, hint, ...rest } = this.props;
return (
<div className={containerClassName}>
<input
{...rest}
className={this.props.className}
onChange={this.props.onChange}
onBlur={this.props.onBlur}
value={this.props.value}
/>
{hint}
</div>
);
}
}
export default inputFactory(ValidatableComponent);
The using it I have:
<ValidatableComponent name="test" id="test" type="email" value={this.props.emailAddress} validations={['required', 'email']} />
Note I tried using the package from npm but noted that it seemed to be missing inputFactory so I am using the following reference in my package.json:
"react-validation": "git+https://github.com/Lesha-spr/react-validation.git",