This guide will go over how to change your accordions “+” sign to a “-” sign when the accordion item is active.
- Select the “accordion item title” layer and navigate to the data tab. Scroll down to the “Element actions” section and select “+ new action”. Now, select “click” as the event and paste this for the action:
state.itemOne = !state.itemOne (this can be named anything and doesn’t need to be called “itemOne”)
- Now, select the plus sign text and select “+ new binding” in the element data bindings section. Select “text” as the property and paste this for the binding:
state.itemOne ? '-' : '+'
Now, a + sign will display when the accordion is not active and a - sign will display when the accordion item is active.
Note: You can repeat these steps for every accordion item, but the state will need to be changed for each (e.g. itemOne, itemTwo, itemThree, and so on for each accordion item).