<template>
<div>
<h1>count: {{ count }}</h1>
<button @click="inc()">Increment</button>
<button @click="dec()">Decrement</button>
<button @click="inc(5)">Increment (+5)</button>
<button @click="dec(5)">Decrement (-5)</button>
<button @click="set(100)">Set (100)</button>
<button @click="reset()">Reset</button>
</div>
</template>
<script>
import { defineComponent } from '@vue/composition-api'
import { useCounter } from '@vueuse/core'
export default defineComponent({
setup() {
const { count, inc, dec, set, reset } = useCounter()
console.log({count})
return {
count,
inc,
dec,
set,
reset,
}
}
})
</script>
元記事を表示する