高德地图的自定义标记点击事件

需求：给地图上marker设置元素属性，进行该元素点击操作

核心代码复现：（vue+element+高德api）

解决方案

1.不能使用vue的@click事件，需要纯js的onclick事件

<button onclick="aaa()">跟踪</button>

2.window上注册aaa方法，可以在项目初始的created或mounted的方法中，指向我们需要操作的方法test

  created() {
    window.aaa = (e) => {
      this.test(e)
    }
  },
  methods: {
  	test(e) {
      console.log(e);
    }
  }

3.如果我们希望该marker中的某些信息传给我们的方法，也会遇到坑


4解决方案：不要使用ES6的模板字符串。在调用方法的元素，老老实实用js拼接

marker.content = 
		`<div class='y-tips'>
            <p>时间: ${e.updatedAt}</p>
            <p>车牌号: 京888888</p>
            <p>司机姓名: ${e.driverName || '张三'}</p>
            <div>`
             	+
            	"<button οnclick='aaa(\"" + e.updatedAt + "\")'>跟踪</button>"
           	 	+
            ` </div>
           </div>`;