Vue Tip: Avoid Empty Class Attributes

1<template>
2  <div :class="isDisabled ? 'disabled' : null"></div>
3  <!-- Will render <div></div> -->
4</template>

1<template>
2  <div :class="isDisabled ? 'disabled' : ''"></div>
3  <!-- Will render <div class></div> -->
4</template>

If you liked this Vue tip, follow me on X to get notified about new tips, blog posts, and more. Alternatively (or additionally), you can subscribe to my weekly Vue & Nuxt newsletter:

Vue Tip: Props and Context in Setup Method

Access props and context in setup method using Composition API in Vue 3

Vue Tip: Destructure in v-for

It is possible to use ES6 destructuring in a v-for in Vue