You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

36 lines
993 B

<template>
<h1>{{ msg }}</h1>
<button
class="px-4 py-1 text-sm text-purple-600 font-semibold rounded-full border border-purple-200 hover:text-white hover:bg-purple-600 hover:border-transparent focus:outline-none focus:ring-2 focus:ring-purple-600 focus:ring-offset-2"
@click="count++"
>
inc product {{ count }}
</button>
<button
class="px-4 py-1 text-sm text-purple-600 font-semibold rounded-full border border-purple-200 hover:text-white hover:bg-purple-600 hover:border-transparent focus:outline-none focus:ring-2 focus:ring-purple-600 focus:ring-offset-2"
@click="inc"
>
inc
</button>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue'
export default defineComponent({
props: {
msg: { type: String, required: true },
n: { type: Number, required: true }
},
setup() {
return {
count: ref(0)
}
},
methods: {
inc() {
console.log('increment count')
this.count++
}
}
})
</script>