NewOldMax / react-form-validator-core

Core validator component for react forms
MIT License
94 stars 44 forks source link

TypeError: Cannot read property 'Consumer' of undefined - v1.0.0 #80

Closed jihdeh closed 4 years ago

jihdeh commented 4 years ago

Hello,

After upgrading to the latest version, I'm having the error. TypeError: Cannot read property 'Consumer' of undefined

value: function render() {
  144 |     var _this2 = this;
  145 | 
> 146 |     return _react2.default.createElement(
      | ^  147 |         _ValidatorForm.FormContext.Consumer,
  148 |         null,
  149 |         function (_ref2) {

Here's my validatorComponent

import React from 'react';
import { ValidatorComponent } from 'react-form-validator-core';

class Input extends ValidatorComponent {
  constructor(props) {
    super(props);
    this.input = React.createRef();
  }

  renderValidatorComponent() {
    const {
      errorMessages,
      validators,
      requiredError,
      validatorListener,
      ...rest
    } = this.props;

    return (
      <>
        <input
          {...rest}
          ref={(r) => {
            this.input = r;
          }}
        />
        {this.errorText()}
      </>
    );
  }

  errorText() {
    const { isValid } = this.state;

    if (isValid) {
      return null;
    }

    return (
      <div style={{ display: 'block' }} className="invalid-feedback">
        {this.getErrorMessage()}
      </div>
    );
  }
}

export default Input;

And I'm using it like

import { ValidatorForm } from 'react-form-validator-core';

<ValidatorForm ref="form" onSubmit={this.onSubmit}>
      <div className="col-md-6">
          <label>Email</label>
           <Input
                type="text"
                className="form-control"
                validators={['required']}
                errorMessages={['Email is required']}
                value={email}
                onChange={this.onChange('email')}
              />
       </div>

       <button
           type="submit"
           className="btn btn-primary btn-lg rounded-0 my-4"
       >
          Send
       </button>
   </ValidatorForm>

"react": "^16.13.1", "react-dom": "^16.13.1", "react-form-validator-core": "^1.0.0"

NewOldMax commented 4 years ago

@jihdeh hi Could you reproduce your issue here: https://codesandbox.com ?

jihdeh commented 4 years ago

@NewOldMax Thanks I couldn't reproduce the issue, if you didn't send me that to reproduce it, I wouldn't have known to restart my server after upgrading the package to pick up new changes 🤦🏼‍♂️.

I appreciate your work! Thanks.