search

NewOldMax / react-form-validator-core

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

Update ValidatorComponent.jsx #89

Closed rwieruch closed 3 years ago

rwieruch commented 3 years ago

Is there a reason why getErrorMessage returns true? We are using this component as stated over here. However, when using 

<FormHelperText>{this.getErrorMessage()}</FormHelperText>

in our code, we get the warning:

Warning: Failed prop type: Invalid prop `children` supplied to `ForwardRef(FormHelperText)`, expected a ReactNode.
    at FormHelperText (http://localhost:3000/static/js/0.chunk.js:19993:24)
    at WithStyles(ForwardRef(FormHelperText)) (http://localhost:3000/static/js/0.chunk.js:54661:31)
    at div
    at FormControl (http://localhost:3000/static/js/0.chunk.js:19303:24)
    at WithStyles(ForwardRef(FormControl)) (http://localhost:3000/static/js/0.chunk.js:54661:31)

I guess it's because we cannot render true which is returned from this.getErrorMessage(). So when I do:

<FormHelperText>
  {this.getErrorMessage() === true ? '' : this.getErrorMessage()}
</FormHelperText>

Everything still works as expected and we don't see this issue anymore. Curious: So is true used somewhere else or why does getErrorMessage return a different data structure based in the if/else conditions?

Otherwise, this PR would fix this issue.

NewOldMax commented 3 years ago

@rwieruch you're using it in a wrong way please see examples in documentation or wiki at least must be used as

<FormHelperText>{!isValid && this.getErrorMessage()}</FormHelperText>