juniorVue.js

Explain 'v-bind' dynamic keys.

Updated May 4, 2026

Short answer

Dynamic keys allow you to bind a reactive variable to the attribute name itself.

Deep explanation

Using square brackets inside v-bind:[attributeName]="value", you can make the attribute name dynamic. This is also applicable to event names with v-on:[eventName]="handler".

Real-world example

Building a generic component where the user can choose whether to bind to 'title', 'aria-label', or 'id'.

Common mistakes

  • Using null as a dynamic key (this will remove the binding).

Follow-up questions

  • Can you use expressions in dynamic keys?

More Vue.js interview questions

View all →