lightning:flow

Represents a flow interview in Lightning runtime. This component requires API version 41.0 and later.

A lightning:flow component represents a flow interview in Lightning runtime.

Specify which flow to render with the name attribute. If it’s appropriate for your flow, initialize the flow’s input variables with the inputVariables attribute.

This example renders the Survey Customers flow (from the Create a Satisfaction Survey Trailhead project).

<aura:component>
   <aura:handler name="init" value="{!this}" action="{!c.init}"/>
   <lightning:flow aura:id="flowData"/>
</aura:component>

In your client-side controller, identify which flow to start.

({
  init : function (cmp) {
    var flow = cmp.find("flowData");
    flow.startFlow("Survey_customers");
  }
})
Usage Considerations

The referenced flow must be active.

The onstatuschange action returns these parameters.

Parameter Type Description
activeStages Object[] The current value of the $Flow.ActiveStages variable in the flow. Available in API version 42.0 and later.
currentStage Object The current value of $Flow.CurrentStage variable in the flow. Available in API version 42.0 and later.
flowTitle String The flow’s label.
helpText String The help text for the current screen. Available in API version 42.0 and later.
guid String The interview’s GUID. Available in API version 42.0 and later.
outputVariables Object[] The current values for the flow’s output variables.
status String The current status of the interview. Valid statuses for a flow interview are:
  • STARTED: the interview successfully started.
  • PAUSED: the interview was successfully paused.
  • FINISHED: the interview for a flow with screens finished.
  • FINISHED_SCREEN: the interview for a flow without screens finished, and the component displayed a default screen with this message: “Your flow finished”
  • ERROR: something went wrong and the interview has failed.
Customizing a Flow’s Finish Behavior

Each flow component includes navigation buttons (Back, Next, Pause, and Finish), which navigate within the flow. By default, when the flow finishes, the component reloads the first screen for a new interview. To customize what happens when the flow finishes, add an event handler for the onstatuschange action when status contains FINISHED. For an example, see Control a Flow’s Finish Behavior in a Lightning Component.

Methods

This component supports the following methods.

startFlow(flowName, inputVariables): Starts a flow interview.
  • flowName (String): The unique name of the flow to render.
  • inputVariables (Object[]): Sets initial values for the flow’s input variables.
resumeFlow(interviewId): Resumes a paused flow interview.
  • interviewId (String): ID of the interview to resume.

For more information, see Working with the Flow Lightning Component.

Attributes

Attribute Name Attribute Type Description Required?
body Component[] The body of the component. In markup, this is everything in the body of the tag.
class String A CSS class for the outer element, in addition to the component's base classes.
title String Displays tooltip text when the mouse moves over the element.
onstatuschange Action The action triggered when the interview’s status changes or a new screen is displayed.