Interactions
Interactions are the building blocks for your web app’s functionality. They create communication between your data, elements, scripts, and web app, allowing you to build an interactive interface.
Click the interaction bar or the button next to the element to start adding interaction.
An interaction consists of (1) an Event to trigger it, and (2) an Action to be performed. Interactions can be added to your pages, elements, and data nodes.
In the Interactions panel below the canvas, you'll be able to visualize the flow of an interaction.
The blue block represents the page, element, or data node that you are editing. Green blocks represent a supported event that will trigger the action. Lastly, the action block contains the action that will be performed.
You are able to add any number of actions to fulfill your requirements and arrange their logical relationships accordingly. See detailed information in Ordering interactions with action flow
Displays the schema of the input received by the action from preceding events or actions. Such input can be utilized within the current action. Consider the example below:
code{
"event": {
"rowData": {},
"tableData": "array",
"rowKey": "string",
"rowIndex": "number"
},
"prev": {}
}
In the context of an action triggered by a table row click event, the data from the clicked row can be accessed using the syntax
${rowData}. See Event payload for more.This refers to the pre-requisites or requirements that need to be met for the action to execute. See Add conditions to interactions for instruction.
This setting allows you to introduce a delay before the action's execution. Input the number of seconds you'd like the system to wait before proceeding.
Example: If you input
5, the action will be executed after a 5-second delay.Want to learn how to add an interaction? Click the following links to get started.
Last modified 18d ago