การทำงานกับ select ใน Vue

การทำงานกับ select จะคล้ายคลึงกัน - เพิ่มแอตทริบิวต์ v-model ไปที่แท็ก โดยจะผูกกับคุณสมบัติ ของออบเจ็กต์ data ข้อความของแท็ก option ที่ถูกเลือก จะถูกเก็บไว้ในคุณสมบัตินี้

โค้ดต่อไปนี้สาธิตตัวอย่าง การทำงานของรายการเลือกแบบหล่นลง:

javascriptdata() {
  return {
    selected: 'value1', // ค่าเริ่มต้น
  }
}

App.vue<template>
  <select v-model="selected">
    <option>value1</option>
    <option>value2</option>
    <option>value3</option>
  </select>
  
  <p>{{ selected }}</p>
</template>