iffieldvisitation-component.md

<IfFieldVisitation>

This component allows you to conditionally render based on a field being visited.

By default, fields are visited when blurred; unless they're checkboxes, then they're blurred by default.

{% hint style="info" %} If you want to conditionally render based on the value of a checkbox, use IfFieldValue instead. {% endhint %}

Props

Prop Name	Prop Type	Description
children	Node	Any number of components.
fallback	Node	Fallback component that displays when. This will change in a future version.
name	String	The base field name without a /.

import {
  IfFieldVisitation,
  OneForm,
} from '@oneform/react'

const ConditionalFieldVisitationExample = () => (
  <OneFormProvider
    values={{
      firstName: '',
    }}
  >
    <div>
      <IfFieldVisitation name="firstName">
        That's a nice name.
      </IfFieldVisitation>
    </div>
  </OneFormProvider>
)

export default ConditionalFieldVisitationExample 

When to use?

This is probably most useful when:

• You have a flow of information and want to limit showing new fields until other fields have been visited.