Vue2.0 和 高德地圖自定義infowindow (事件)

clipboard.png
1: 定義全局(事件)函數

   let infoWindow;
   let infoWindowContent = `
      <div class='info-window'>
        <
        <button  onclick='ClickFunction()'>事件</button>
      </div>
    `;
    infoWindow = new AMap.InfoWindow({
      content: infoWindowContent,
    });

  ClickFunction() 必須是全局函數  否則會報未定義錯誤 
  

但是此方法 獲取不到當前組件對象(有的人需要獲取組件對象 處理) 此方法便行不通

2 : 使用 vue.extend() 生成html

首先 引入vue   
    import Vue from 'vue';
    
    var _this = this    當前組件對象
    生成html 和 時間
       var MyComponent = Vue.extend({
            template: '<a style="color:#07bb49;" v-on:click="world()">add Shop</a>',
            methods:{
                 world:function() {
                        console.log(_this)
                        //點擊事件 使用 組件對象
                  }
            }
        });
    var component= new MyComponent().$mount();
     infowindow 內容定義   
     var infoWindow = new AMap.InfoWindow({
                   content : component.$el
           });

infowindow 彈出實現在這忽略 詳情查看高德地圖

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章