Add actions to your components

The Actions menu enables you to add action nodes to your components. Each node corresponds to a specific function, event, or property, which you can integrate into your application logic by building node connections. In this example, the Button component's onClick event calls the Text component's setLabel node. This prompts the text label to change when the button is clicked.
Some components include preset actions (e.g. the Variable component comes with the setValue, value, getValue,and onChange actions by default). In addition, when you add some actions to a component they automatically add related properties (e.g., the setLabel action also adds the label property).
Note: You can only access component actions from the quick selection menu in the Logic view.
This page provides an overview of the following topics:

Common actions

You can add the following actions to almost any Design Reference:
  • activate: Shows a component that was hidden from view.
  • deactivate: Hides a component. Deactivate is analogous to d-none in HTML.
  • destroy: Deletes the component.
  • onClick: Triggers an event when the component is clicked.

Add an action

To add an action to your component:
  1. 1.
    Select a component to open the quick selection menu.
  2. 2.
    Select the lightning icon to open the Actions menu.
  3. 3.
    Use the search bar to locate the action you want to add.
  4. 4.
    Click the action to add it to your component.

Delete an action

To delete an action from your component:
  1. 1.
    Select a component.
  2. 2.
    Select the lightning icon to open the quick selection Actions menu.
  3. 3.
    Locate the action you want to delete and click the trash icon.
  4. 4.
    The action immediately disappears.