Nuxt/examples/composables/use-async-data/components/CounterExample.vue
Clément Ollivier 1a7b570c82
docs(examples): add examples to docs (#3966)
Co-authored-by: Pooya Parsa <pyapar@gmail.com>
2022-03-30 17:59:28 +02:00

20 lines
443 B
Vue

<script setup>
const ctr = ref(0)
const { data, pending, refresh } = await useAsyncData('/api/hello', () => $fetch(`/api/hello/${ctr.value}`), { watch: [ctr] })
</script>
<template>
<div>
{{ data }}
<div class="flex justify-center gap-2">
<NButton :disabled="pending" @click="ctr++">
+
</NButton>
<NButton :disabled="pending" @click="refresh">
</NButton>
</div>
</div>
</template>