I am trying to implement a functionality where, when the minus button is clicked and the value reaches 0, the minus button gets hidden and the plus button becomes visible again to add values. I have managed to make the minus and plus buttons work but need assistance with hiding/showing them in Vue.js as I am still new to it.
<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>