Javascript 如何在vue js中使用google maps的infowindow内的@click触发函数？

我现在的代码是

addpolygon: function(e) {
      var vm = this;
      var point = {
        lat: parseFloat(e.latLng.lat()),
        lng: parseFloat(e.latLng.lng())
      };
      vm.coord.push(point);
      vm.replot();
      vm.marker = new google.maps.Marker({
        position: point,
        map: vm.map,
        icon: "/fred.png"
      });
      vm.infowindow = new google.maps.InfoWindow({
        content:"<a class=\"btn btn-danger\" @click.native=\"removePoint("+vm.markerid+)\">Remove</a>",
        maxWidth: 300
      });
      vm.bindInfoWindow(vm.marker, vm.map, vm.infowindow);
      vm.markers[vm.markerid] = {
        marker: vm.marker,
        point: point
      };
      vm.markerid++;
    },

但我无法使用上述代码触发相同的事件。当我点击“移除”按钮时，什么也没有发生。同样的问题是什么。请帮我找到解决方案？

新方案 使用普通的旧单击处理程序从

InfoWindow

调用全局方法

`onclick="removePoint(${vm.markerId})"`

然后使用闭包从全局方法访问vm

const vm=this
window.removePoint=函数（id）{
vm.removePoint（id）
}

如果有多个实例，则需要扩展此方法

老办法 这里有两个问题

首先，修复有关引号的语法错误

vm.markerid+”\“>删除“

更好的是，利用模板字符串来避免这种引用疯狂

vm.infowindow=new google.maps.infowindow（{content:`

@click.native=\“$window.removePoint（“+vm.markerid…”


函数移除点（id）{
log（`removing point${id}…`）
}
@StevenSpungin解决方案非常有效。谢谢。只是为了简单起见

创建标记内容时

markerContent += `<button onclick='editVehicle(${vehicle.id});'>EDIT</button>`;

在装入的方法中，将窗口方法映射到vue方法：

mounted(){
    this.initMap();
    window.linkToKey = this.linkToKey;    // vue method wired to window method
},

在信息窗口的html中：

const contentString =`<img onClick="linkToKey('${video.key}')" src="images/${video.key}.png">`;
const infowindow = new google.maps.InfoWindow({
    content: contentString,
});

然后window方法连接到您的vue方法，您可以按预期完成信息窗口中任何项目的所有操作
看起来您在此处出现语法错误：
vm.markerid+\“>Remove”
。最后一个字符串没有打开的引号。它应该是
vm.markerid+”>“>Remove”
Sir我尝试过这是一个按钮设置错误，作为未捕获引用错误：在HTMLButtoneElement中未定义removePoint。OnClick是Vue对象中定义的removePoint，如addPolygon？它可能位于任何Vue对象之外，可以从非Vue管理的元素访问（地图的信息窗口可能没有附加到Vue根元素）先生，removePoint是一个在AddPolygonth下面定义的函数。我也认为
窗口。editAppointment
应该是
窗口。editVehicle
根据您的
onclick
我尝试了
订购数据
和
创建（）
与您的示例相同，只是
window.editVehicle
mounted(){
    this.initMap();
    window.linkToKey = this.linkToKey;    // vue method wired to window method
},

const contentString =`<img onClick="linkToKey('${video.key}')" src="images/${video.key}.png">`;
const infowindow = new google.maps.InfoWindow({
    content: contentString,
});

methods: {
    linkToKey(key) {
        console.log('key', key);            
        this.$router.push(`/video/${key}`);
    },