Horizontal accordion auto-close on open

Plasmic Studio Questions
1

Hi! I have this horizontal accordion on a build using the Plasmic state. How can I make it so that when I open one accordion, all the others close???

2

Hi @aggregate_booby! There are different ways to accomplish it. A possible solution is to have a state variable like currentSection in the wrapper component (the component that wraps all sections), set it depending on which element is clicked, and set a isOpen variant in each section based on its value. Would that work out for you?

3

I’ll try your version! but so far I’ve done it this way: on click the first step launches this code - $state.accordinItems.forEach((item) => {
if (item.open = true) {
item.open = false;
}
})
And the second step toggles the open variable of the current item. Is this normal?

4

Hmmmm, I think your solution should work. It’s just setting open to false for every item, so you could simplify it to $state.accordionItems.forEach(item => item.open = false)

5

You’re right it works) I did so because I want the first accordion to be open by default…

6

This is really better - $state.accordionItems.forEach(item => item.open = false)

7

Good afternoon, I found that my solution does not work very well could you tell me in more detail how to do it? I created the current Section variable in the wrapper, but I can’t make it work any further, it turns out that either everything opens or it doesn’t open at all(