vue fetch api

<template>
  <div>
    <button @click="fetchData">Fetch Data</button>
    <ul>
      <li v-for="item in data" :key="item.id">{{ item.name }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      data: []
    };
  },
  methods: {
    fetchData() {
      fetch('https://api.example.com/data')
        .then(response => response.json())
        .then(data => (this.data = data))
        .catch(error => console.error('Error fetching data:', error));
    }
  }
};
</script>

<style>
/ Add your styles here /
</style>