01-component.vue

<template>
  <div>
    <button type="button" @click="decrement(step)">-</button>
    <input type="text" :value="value" @input="setValue($event.target.value)" />
    <button type="button" @click="increment(step)">+</button>
  </div>
</template>

<script>
export default {
  name: 'Counter',
  props: {
    value: {
      default: 0,
      type: Number
    },
    step: {
      default: 1,
      type: Number
    }
  },
  methods: {
    setValue(value) {
      this.$emit('input', parseFloat(value));
    },
    increment(step) {
      this.setValue(this.value + step);
    },
    decrement(step) {
      this.setValue(this.value - step);
    },
  },
};
</script>