แอตทริบิวต์ class ในเฟรมเวิร์ก Vue

การทำงานกับแอตทริบิวต์ class นั้นทำผ่าน คำสั่ง v-bind หรือ รูปแบบย่อของมัน มาดูกันในทางปฏิบัติ สมมติว่าคุณสมบัติ str เก็บคลาส CSS ของแท็ก คั่นด้วยช่องว่าง:

javascriptdata() {
  return {
    str: 'active valid',
  }
}

เพิ่มคลาส CSS เหล่านี้ ไปยังแท็กบางอัน:

App.vue<template>
  <p :class="str">text</p>
</template>