Updating Height with Dynamic Content

[vencho-mdp]

Hi! Me again haha. I found a bug that when you change the content inside the accordion, the height of it doesn't change, producing an overflow. Maybe you could expose the recompute height method or something like that?

[opichon]

I'll take a look at this. Thanks for reporting the issue!

[vencho-mdp]

Just to clarify what I mean, given two components that have different heights, when you conditionally render one or the other, the accordion doesn't change its height (it shows an overflow if the height of the new component is more than the height of the previous one, or it shows blank space). It'd be great if the accordion could recompute its height with maybe a smooth transition or something like that.

[vencho-mdp]

@opichon Do you need any help?

[opichon]

You mean that you want to render the content of an accordion tab with 1 of 3 components. The 2 components have different heights. Is this correct?

[opichon]

Can you share the code that you use?

[vencho-mdp]

Nono, actually is like this.

<Accordion>
 <div v-if="isUserAuthenticated" style="height:200px;"> 200px </div>
  <div v-else style="height:300px;"> 300px </div>
</Accordion>

When isUserAuthenticated changes, there is a bug with the accordion's height.

[vencho-mdp]

Hi! Have you checked this out?

[vencho-mdp]

Any updates?