Update Component State

Using this action, you can set/clear values for the Component State variable.

Using Component State variable to maintain the state of Ligh/Dark mode switch

Prerequisites

Before you add this action, you'll need to create the Component State variable.

Types of update

There are the following types of updates you can make to a Component State variable:

• Set Value: Used to set the value either from any other variable or a specific one.

• Clear Value: Used to remove the already stored value.

• Increment/Decrement: Used to increment or decrement the value of a variable defined as an Integer.

• Add to List: Used to add an item to the variable defined as List.

• Remove from List: Used to remove an item from the variable defined as List.

Adding Update Component State action

Follow the steps below to add this action to any widget.

1. Select the Widget (e.g., Switch, Button) on which you want to add the action.

2. Select Actions from the properties panel (the right menu), If it's the first action, click the + Add Action button. Otherwise, click the "+" button below the previous action tile (inside Action Flow Editor) and select Add Action.

3. Search and select the Update Component State (under State Management) action.

4. Click on + Add Field and select the field you want to update.

5. Expand the field section and Select Update Type. Further options are displayed based on the update type selected.

6. Now you can provide a value either From Variable or from a Specific Value. For example, to provide value from a widget state, select UNSET > Widget State > [widget_name].

7. Optional: you can also specify how this update will affect your app.

   • Rebuild Containing Page: This will rebuild the page on which the current component is added. Use this option when Containing Page depends on this variable to reflect the new changes. This ensures that the UI is always up-to-date and responsive to user interactions.

   • Rebuild Current Component: This will rebuild the current component.

   • No Rebuild: This won't rebuild anything.

To update multiple component state variables one after another, simply click + Add Field and chain the next variable using this action.

Adding Update Component State action