Working with the Flow Lightning Component

Once you embed a flow in a Lightning component, use JavaScript and Apex code to configure the flow at run time. For example, pass values into the flow or to control what happens when the flow finishes. lightning:flow supports only screen flows and autolaunched flows.

A flow is an application, built with the Cloud Flow Designer, that collects, updates, edits, and creates Salesforce information.

To embed a flow in your Lightning component, add the <lightning:flow> component to it.

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

1({
2    init : function (component) {
3        // Find the component whose aura:id is "flowData"
4        var flow = component.find("flowData");
5        // In that component, start your flow. Reference the flow's Unique Name.
6        flow.startFlow("myFlow");
7    },
8})

When a user opens a page that has a flow component, such as Lightning App Builder or an active Lightning page, the flow runs when the page loads. Make sure that the flow doesn’t perform any actions – such as create or delete records – before the first screen.

Note

Lightning Components Developer Guide

Working with the Flow Lightning Component

See Also