การใช้งาน await ใน script setup

เมื่อใช้ await ใน script setup ของ <script> ของ Vue 3, เราสามารถใช้คำสั่งนี้เพื่อรอคำตอบจาก promise ก่อนที่ส่วนที่เหลือของ script จะถูกดำเนินการ ตัวอย่างเช่น:

<script setup>
import { ref } from 'vue';

const data = ref(null);

const fetchData = async () => {
  try {
    const response = await fetch('https://api.example.com/data');
    data.value = await response.json();
  } catch (error) {
    console.error('Failed to fetch data:', error);
  }
};

await fetchData();
</script>

<template>
  <div>{{ data }}</div>
</template>

ในตัวอย่างนี้ เราใช้ await เพื่อให้แน่ใจว่า fetchData ทำงานเสร็จก่อนที่จะดำเนินการต่อไป.