🖥
Nuxt2 / Nuxt3 (Vue ) - ボタンをクリックしたら Fetch で GETリクエストする
コード例
<template>
<div>
<div>
<button @click="getTodos">getTodos</button>
</div>
<ul>
<li v-for="item in items">
{{ item.id }} {{ item.title }}
</li>
</ul>
</div>
</template>
<script>
export default {
data: () => {
return {
items: [],
};
},
methods: {
async getTodos() {
const data = await fetch('https://jsonplaceholder.typicode.com/todos/')
const json = await data.json()
this.items = json
}
},
};
</script>
表示例
<img width="867" alt="image" src="https://user-images.githubusercontent.com/13635059/211199744-0c4a2d95-4cce-4ece-b000-7fd1fdeef6d6.png">
チャットメンバー募集
何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。
公開日時
2023-01-08
Discussion