javascript - Vue js-当值达到0时隐藏减号按钮并取消隐藏加号按钮

Question

这个想法是当减号按钮被点击直到0时，我需要隐藏减号按钮，然后取消隐藏加号按钮以再次添加值。我在这里尝试过，我成功地实现了减号和加号功能。任何人都可以帮助我，我还是 vuejs 新手。

<template>
  <div class="message"># {{ count }}<br>
    <p># {{ count }}</p>
    <button v-on:click.prevent="increment">+</button>
    <button v-on:click.prevent="decrement">-</button>
  </div>
</template>
    
<script>
export default {
  data: ()=> {
    return {
      count: 5
    }
  },
  methods: {
    increment() {
      this.count++;
    },
    decrement() {
      if(this.count > 0) {
        this.count-- ;
      }
    }
  }
}
</script>

Answer 1

当值为 0 时，您可以执行此操作以隐藏 -:

<button v-if="count > 0" v-on:click.prevent="decrement">-</button>