How to Build an Accordion Component in Vue.JS from Scratch πŸ‘Œ

Many UI libraries allow us to implement accordion and other simple components. But do you need these libraries?
They give you less flexibility and will increase the bundle size of your application.

Create components from scratch such as accordions, modals, tabs, dropdowns, etc. is the way for your projects.

Create a reusable accordion component :point_down:

Tutorial: How to Build an Accordion Component in Vue.JS | by Luca Spezzano | NotOnlyCSS | Nov, 2021 | Medium
Demo: Accordion Vue.js - CodeSandbox

2 Likes

Great article!!

1 Like

I like the article, but I would call this a β€œdisclosure”, β€œexpander”, or β€œexpansion panel”. An accordion typically has multiple sections and only one expanded at a time.

Anyhow, I might be splitting hairs. Good work either way!

1 Like

Cool article and very helpful. Thanks a lot.

1 Like

hey @93lucasp
Your article is really helpful.

1 Like

Thanks, happy about that :slight_smile: you can follow me on Medium when i have time i publish articles like that :slight_smile:

Thanks, happy about that :slight_smile: you can follow me on Medium when i have time i publish articles like that :slight_smile: