Vue 3 Get API AXIOS

依頼

Vue3 を使ってください。
axiosでAPIを呼んでください。
Getでお願いします。
APIは以下のアドレスを使ってください。
https://jsonplaceholder.typicode.com/users
Composition APIを使ってください

chatGBTからの回答

npm install axios

UserList.vue
<script>
<template>
  <div>
    <ul>
      <li v-for="user in users" :key="user.id">{{ user.name }}</li>
    </ul>
  </div>
</template>

<script>
import { ref, onMounted } from 'vue';
import axios from 'axios';

export default {
  setup() {
    const users = ref([]);

    onMounted(async () => {
      try {
        const response = await axios.get('https://jsonplaceholder.typicode.com/users');
        users.value = response.data;
      } catch (error) {
        console.error(error);
      }
    });

    return {
      users
    };
  }
};
</script>

App.vue

<template>
  <div>
    <UserList />
  </div>
</template>

<script>
import UserList from './UserList.vue';

export default {
  components: {
    UserList
  }
};
</script>