bug with if statements and vuejs reestart counter

I'm writing a simple piece of code that increases a counter everytime you click a specific button and it reestarts when you reach 3, the number is shown in each button, it seems to work ok however I have a weird bug: if the first button isnt set to 0 when you press any other button it restarts the first button back to 0. It seems the buttons are linked somehow?

<div id="app">
 <button @click="chooseOne(1,one)">
  
 </button>
 <button @click="chooseOne(2,two)">
   
 </button>
 <button @click="chooseOne(3,three)">
  
 </button>
 </div>

JS

new Vue({
  el: "#app",
  data: {
    one: 0,
    two: 0,
    three: 0
  },
  methods: {
    chooseOne: function(x, y) {
      if ((x == 1) && (this.one < 3)) {
        this.one++;
      } else {
        this.one = 0
      }
      if (x == 2) {
        if ((x == 2) && (this.two < 3)) {
          this.two++;
        } else {
          this.two = 0
        }
      }
      if (x == 3) {
        if ((x == 3) && (this.three < 3)) {
          this.three++
        } else {
          this.three = 0
        }
      }
    }
  }
})