Trigger Component

[dorilama]

Let’s try with a counter:

• create a component with 2 buttons and a text
  

• add a variable to store the count
  

  

• add a trigger, we want to notify the parent about a change of the count
  
  

• add a component workflow. It’s not necessary but both the buttons will share the same logic, so we want to set this up just in one place. We want to change the count by an amount, so we add a parameter amount of type number.
  
  

• add an action to change the variable
  

  

• add an action to trigger the event. Set the event value to an object with a paramenter count with the value of the count variable. This data will be available to the parent’s workflow.
  

  
  
  

• add a workflow on the buttons and trigger the workflow handling the counter increments. One button will use amount 1 and the other -1
  

  

• bind the text to display the count
  

  

The component is ready: it display the current count, it can increment or reduce the count and it triggers an event to communicate with the parent.

• on the parent add a workflow triggered by the component’s trigger
  
  
  

• use the data of the event
  

  

In this example the counter is a reusable component, while outside the parent listens to the trigger and update a visualization in a list with the received data.