在Vue 2中混合使用动态和条件类名

<template>
  <div :class="dynamicClass"></div>
</template>

<script>
export default {
  data() {
    return {
      isActive: true
    }
  },
  computed: {
    dynamicClass() {
      return {
        active: this.isActive
      }
    }
  }
}
</script>

<template>
  <div :class="{'active': isActive}"></div>
</template>

<script>
export default {
  data() {
    return {
      isActive: true
    }
  }
}
</script>

<template>
  <div :class="{'active': isActive, 'highlight': isHighlighted}"></div>
</template>

<script>
export default {
  data() {
    return {
      isActive: true,
      isHighlighted: false
    }
  }
}
</script>