31 lines
580 B
Vue
31 lines
580 B
Vue
|
<script>
|
||
|
|
import { defineComponent, ref } from 'vue';
|
||
|
|
|
||
|
|
export default defineComponent({
|
||
|
|
name: 'MyButton',
|
||
|
|
props: {
|
||
|
|
incrementStep: {
|
||
|
|
type: Number,
|
||
|
|
default: 1,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
setup(props) {
|
||
|
|
const counter = ref(0);
|
||
|
|
const input = ref('rocket muffin');
|
||
|
|
function increment() {
|
||
|
|
counter.value += props.incrementStep;
|
||
|
|
}
|
||
|
|
|
||
|
|
return { counter, input, increment };
|
||
|
|
},
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div>
|
||
|
|
<p class="content">{{ input }}</p>
|
||
|
|
<span>{{ counter }}</span>
|
||
|
|
<q-btn class="button" @click="increment()"></q-btn>
|
||
|
|
</div>
|
||
|
|
</template>
|