vue项目中Leaflet popup标牌自定义点击事件，并传递参数

vue项目中Leaflet popup标牌自定义点击事件，并传递参数

一个地图项目中使用到leaflet地图，根据后端数据循环在地图上生成标记点markers，点击marker时弹出popup标牌，然后用过标牌的按钮，进行后续操作，比如，路由跳转，打开新的模态框等等…

遇到的问题

data(){
	return{
		curData:'',
	}
},
methods:{
	func(){
		console.log('1111111')
	}
},
mouted(){
	this.map = L.map("map", {
        center: [26.16479,114.1164],
        zoom: 8,
      });
// 通过循环生成marker
	let arr = [{point:[39.905530, 116.391305],data:'1111'},
	{point:[32.905530, 116.391305],data:'2222'}] //模拟数据
	for (let i in arr){
		let marker = L.marker(arr[i].point).addTo(this.map);
		//给marker绑定标牌
		marker.bindPopup(
		`<div style='width:138px'><a οnclick="func()" style='color:red'>收藏</a></div>`);
	}
}

这时标记点能正常生成，但是点击弹出的标牌上的收藏按钮，绑定的vue事件func无法响应

解决问题

window.a = this.func //将vue方法挂载到window对象
data(){
	return{
		curData:'',
	}
},
methods:{
	func(){
		console.log('1111111')
		console.log(this.curData) //获取到marker点击时传递的参数
	}
},
mouted(){
	this.map = L.map("map", {
        center: [26.16479,114.1164],
        zoom: 8,
      });
// 通过循环生成marker
	let arr = [{point:[39.905530, 116.391305],data:'1111'},
	{point:[32.905530, 116.391305],data:'2222'}] //模拟数据
	for (let i in arr){
		let marker = L.marker(arr[i].point).addTo(this.map);
		//监听marker点击事件，通过curData绑定点击事件需要传递的数据
		marker.on('click',()=>{
			this.curData = arr[i]
		})
		//给marker绑定标牌
		//标牌上按钮的点击事件绑定window上的a方法，这样就能调用vue的方法，并且通过marker点击事件能获取到循环传递的参数
		marker.bindPopup(
		`<div style='width:138px'><a οnclick="a" style='color:red'>收藏</a></div>`);
	}
}

目前能想到的方法只有这样，如果有其他实现方式，欢迎讨论