I was trying to make a slider with **Vue JS**  
 I have somehow managed to add background and bottom bullets working. But slide anchors (prev and next) function is not firing @click.  

**HTML of only anchors**. [Link to complete html](https://chaggy-vuetodo.web.app/sliders)  

```
        <div class="left-anchor w-8 h-8 text-white" @click="sliderCount(-1)">
          <svg  xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 19l-7-7 7-7m8 14l-7-7 7-7" />
          </svg>
        </div>
        <div class="right-anchor w-8 h-8 text-white" @click="sliderCount(1)" >
          <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 5l7 7-7 7M5 5l7 7-7 7" />
          </svg>
        </div>

```

**Script**

```
export default {
data:function(){
    return{
        interval:"",
        currentSlide:0,
        images:['alexandr.jpg','pixabay.jpg','tim-mossholder.jpg'],
        image:''
    }
},
methods:{
  sliderCount:function(count){
      this.currentSlide = (this.currentSlide >= 2) ? 0 : this.currentSlide + count
  },
  setCurrentSlide:function(count) {
      this.currentSlide = count - 1
  }
},
mounted(){
},
beforeMount(){
    this.interval = ''
}
}

```

**Why isn't this @click function working?**