hook component can not use useSelector to get form values

[cc616]

Subject of the issue

Your environment

Software	Version(s)
redux-form	8.2.4
redux	4.1.0
react-redux	7.2.4
react	17.0.2
react-dom	17.0.2
Browser
Operating System

Steps to reproduce

https://codesandbox.io/s/redux-form-example-de1di?file=/src/App.tsx

Expected behaviour

work

Actual behaviour

can not work
Maximum update depth exceeded.

Other information

how to get form values with hook component

[mj12albert]

Nothing to do with useSelector

<Field
            name="firstName"
            component="input"
            type="text"
            validate={[maxLength(1)]} <-------------- this is the cause
            placeholder="First Name"
          />

if you are using field validation, the functions passed to the validate prop must be static, e.g.

const maxLength = max => value =>
  value && value.trim().length > max ?  'error' : undefined;

const maxLength1 = maxLength(1);

<Field
            name="firstName"
            component="input"
            type="text"
            validate={[maxLength1]}
            placeholder="First Name"
          />

alternatively, use sync validation