problem description

my scene is that several circles are dragged around a big circle, and all the circles of any circle are scrolled 360 degrees uniformly. The following code calculates the angle of the small circle, but I drag the event to trigger the scrolling of only one of the small circles

the environmental background of the problems and what methods you have tried

the problem is that I need to drag any small circle that scrolls 360 degrees itself and other circles. So far, I have only realized which one to scroll, and I have also used ref to get it. My current thinking is how event triggers can get its properties and then change it, just like the following code drag is currently in effect

related codes

/ / Please paste the code text below (do not replace the code with pictures)

<ul class="menu">
      <v-touch v-for="(img,index) in imgDeg" :key="index" @swipeleft="swiperleft(img)"
        @swiperight="swiperright(img)" :style="{"transform": "rotate(" + img.deg + "deg)"}" tag="li">
        <div :style="{"backgroundColor": img.color,"transform": "rotate(" + img.textDeg + "deg)"}">{{img.img}}</div>
      </v-touch>
 </ul>
 
data () {
    return {
     imgs: ["","","","","","","","","","","",],
     imgDeg: [],
    }
  },
 methods: {
     swiperleft (img){
      console.log()
      img.deg = img.deg - 360;
    },
    swiperright (img){
      img.deg = img.deg + 360;
    }
},
mounted (){ 
  this.imgs.forEach((index,l) => {
      let deg = 360 / this.imgs.length;
      //console.log(deg);
      this.imgDeg.push({
        "img":index,
        "deg": deg * l,
        "color": "rgb(" + this.randomFrom(43,161) + "," + this.randomFrom(140,217) + "," + this.randomFrom(155,190) + ")",
        "textDeg": (deg * l) - (deg * l * 2),
      })
    })
}

what result do you expect? What is the error message actually seen?

event triggered, how can I get the data for each item of it and then manipulate them.