When I am clicking on submit button error not showing in form validation. But when I am changing any text in input field it’s giving errors. Like if I am not filling fname field and submitting form it’s not showing anything on UI but when I type a single letter than it’s showing error. What is wrong in below code block?

When I am clicking on submit button error not showing in form validation. But when I am changing any text in input field it’s giving errors. Like if I am not filling fname field and submitting form it’s not showing anything on UI but when I type a single letter than it’s showing error. What is wrong in below code block?

After placing this piece of code in my component, getting this error,

I have two components in my demo application (Autocomplete and Text Field). I want to show only one component at any given time. The condition is that when the user uses SLASH (/), it will show the Text Field component; otherwise, it will show Autocomplete.

I am using below package react-if .
https://www.npmjs.com/package/react-if