how to access validation result on blur in redux form - reactjs

Question

I want to stop anything onblur function if validation fails. i am not sure how to do this
here is the field
<Field
label="Demand Ref"
name="demand_ref"
component={this.renderTextField}
type="text"
onBlur={e => this.onAfterSaveCell(e, 'demand_ref')}
onFocus={e => this.onBeforeSaveCell(e, 'demand_ref')}
validate={[validateDemandRef]}
maxlength="15"
/>
if validate fails i don't want anything in onBlur to run. how can i do this?
UPDATE
If i am using validate={[validateDemandRef]} what do i pass into ...some validation
UPDATE 2
how woudl this look if it is a class const MyComponent = ({ handleSubmit, valid }) => (. MyComponent is a class

Answer 1

Use the isValid or isInvalid selectors (https://redux-form.com/7.4.2/docs/api/selectors.md/)
import React from 'react';
import { compose } from 'redux';
import { reduxForm, isValid } from 'redux-form';
const MyComponent = ({ handleSubmit, valid }) => (
<form onSubmit={handleSubmit}>
<Field
label="Demand Ref"
name="demand_ref"
component={this.renderTextField}
type="text"
onBlur={valid && e => this.onAfterSaveCell(e, 'demand_ref')}
onFocus={e => this.onBeforeSaveCell(e, 'demand_ref')}
validate={[validateDemandRef]}
maxlength="15"
/>
<button type="submit">Submit</button>
</form>
);
const FORM_NAME = 'my-form';
export default compose(
reduxForm({
form: FORM_NAME,
}),
connect(state => ({
valid: isValid(FORM_NAME)(state), // also there is an isInvalid selector
})),
)(MyComponent);
For stateful component implementation
import React, { PureComponent } from 'react';
import { compose } from 'redux';
import { reduxForm, isValid } from 'redux-form';
class MyComponent extends PureComponent {
render() {
const { handleSubmit, valid } = this.props;
return (
<form onSubmit={handleSubmit}>
<Field
label="Demand Ref"
name="demand_ref"
component={this.renderTextField}
type="text"
onBlur={valid && e => this.onAfterSaveCell(e, 'demand_ref')}
onFocus={e => this.onBeforeSaveCell(e, 'demand_ref')}
validate={[validateDemandRef]}
maxlength="15"
/>
<button type="submit">Submit</button>
</form>
);
}
}
const FORM_NAME = 'my-form';
export default compose(
reduxForm({
form: FORM_NAME,
}),
connect(state => ({
valid: isValid(FORM_NAME)(state), // also there is an isInvalid selector
})),
)(MyComponent);