Dynamically Update a Flow Screen with an Aura Component

To conditionally display a field on your screen, build an Aura component that uses aura:if to check when parts of the component should appear.

In this example, this component (c:flowDynamicScreen) displays a custom script component and a group of radio buttons. The component gets the contact’s existing phone number from the flow, and uses that value to fill in the script.

A flow screen that shows a script and a radio button field.

If the user selects the No radio button, the component displays an input, where the user can enter the new phone number.

When No is selected, the Phone field displays.

When the user tabs out, or otherwise removes focus from the Phone input, the controller sets the newPhone attribute to the input value, so that you can reference the new number in the flow.

The script in c:flowDynamicScreen uses tokens to stay in sync with the Salesforce Lightning Design System styles.

See Also