In this tutorial, you’ll learn everything about the Component Interactions within the Page Builder.
Last updated: 27-08-2020
Component Interactions are, like the name already suggests, interactions between a component that manipulates the options of another component. They can be used to dynamically change- or interact with the content of a page and even more!
The main purpose of Component Interactions is to provide an easy way to interact between components without having to write code. Instead of writing code, you’re able to choose from sets of predefined options. These options consist of a list of triggers, interaction types, functions and the target components. Together they form the structure of a Component Interaction.
Triggers are events that are initiated via user input. These can be the default triggers provided by the platform, or the custom triggers from your custom component set. Interaction types are the way in which functions are being executed. When a trigger is initiated it’ll get followed up by the type of interaction that’s selected. Based on the selected interaction, you’ll be able to select a function, or the target component right away.
Functions are actions that affect and/or change other components and when a trigger is initiated it’ll get followed up by the function that’s selected. The target component is the component that’s being changed by the Component Interaction. Depending on what you’ve selected for the previous options, you may also be able to select a component’s option to change the value of.
That was it for this tutorial. If you want to know more about Component Interaction options in detail, feel free to check out our Page Builder Reference and scroll down to the Component Interactions paragraph! We also provide a tutorial on How to use Component Interactions in which we’ll explain a certain use case that you can follow along!