Vue uses js for loop to dynamically generate variable names and assign values

Desired effect:

var marker1 = new BMap.Marker(new BMap.Point(res.data.data[0].gpsX, res.data.data[0].gpsY),{
    
    icon:myIcon});
var marker2 = new BMap.Marker(new BMap.Point(res.data.data[1].gpsX, res.data.data[1].gpsY),{
    
    icon:myIcon2});
var marker3 = new BMap.Marker(new BMap.Point(res.data.data[2].gpsX, res.data.data[2].gpsY),{
    
    icon:myIcon2});
var marker4 = new BMap.Marker(new BMap.Point(res.data.data[3].gpsX, res.data.data[3].gpsY),{
    
    icon:myIcon});
       
map.addOverlay(marker1);
map.addOverlay(marker2);
map.addOverlay(marker3);
map.addOverlay(marker4);

For loop implementation:

this.$axios({
    
    
        url: "/api/device/jiankongDevice/getJiankongDeviceAllList",
        method: "get",
        headers: {
    
    
          "X-Requested-With": "XMLHttpRequest",
          platform: 0,
          token: localStorage.getItem("token"),
        },
        params: {
    
    },
      }).then((res) => {
    
    
        console.log(res);
        for(var i in res.data.data){
    
    
          var marker = 'marker'+i
          marker=new BMap.Marker(new BMap.Point(res.data.data[i].gpsX, res.data.data[i].gpsY),{
    
    icon:myIcon});
          map.addOverlay(marker);
        } 

If you want to add events to each variable generated, you need to use event listener addEventListener(), and you need to use closures. For details, please see my next article