Vue v-bind only partially works-CodePudding

I have in my componentens some buttons, that looks like this:


<v-btn
  class="mx-2"
  dark
  fab
  v-bind:color="items.status===0 ? '#FF9C10' : 'grey'"
  style="font-weight: bold;"
  @click="setStatus(0)"
>
</v-btn>
<v-btn
  class="mx-2"
  dark
  fab
  v-bind:color="items.status===10 ? '#FF9C10' : 'grey'"
  style="font-weight: bold;"
  @click="setStatus(10)"
>
</v-btn>

How you can see, the status of an item decided which color is selected. Now, when a user clicks on a button, the status will be changed. And now the strange thing is happened, when the status was 0, and I clicked on the second button, I see in the console that the new status is 10. The first button became grey again, but the second will never become the other color. So my question is, did I use the v-bind here wrong?

CodePudding user response：

I could fixed the issue. In the setStatus function, I used switch. This was not working correctly. Now everything works perfectly fine.