2016-05-10 105 views
0

我想我VUEJS模塊中使用一個混合:VueJS混入方法

模塊

<script> 
    var GoogleMaps = require('../mixins/GoogleMaps'); 

    export default { 
     mixins: [GoogleMaps], 
     events: { 
      MapsApiLoaded: function(data) { 
       GoogleMaps.initGISMap(data); 
      } 
     }, 
} 
</script> 

密新

export default { 
    methods: { 
     initGISMap(selector) { 
      map = new google.maps.Map(selector, { 
       zoom: 10, 
       mapTypeId: google.maps.MapTypeId.ROADMAP, 
      }); 

      // Set initial Location and center map to this location 
      initialLocation = new google.maps.LatLng(48.184845, 11.252553); 
      map.setCenter(initialLocation); 

      // Create a searchmarker 
      searchMarker = createMarker(); 

      // Init Autocomplete for GIS 
      initAutoComplete(); 
     } 
    } 
} 

但我得到一個錯誤,即谷歌地圖。 initGISMap不是一個函數。如何在組件中使用mixin的方法?

+0

我相信你需要引用mixin。所以在模塊this.GoogleMaps.initGISMAP(數據) – vbranden

回答

5

- 編輯,以正確的錯誤,我在詮釋您的需求

當使用混入,你不引用方法MixinName.method()做 - 它只是「這」 - 通過返回的這些方法和屬性的mixin並且是第一順序,可以這麼說,所以他們必然會'這個'。

<script> 
    var GoogleMaps = require('../mixins/GoogleMaps'); 

    export default { 
     mixins: [GoogleMaps], 
     events: { 
      MapsApiLoaded: function(data) { 
       this.initGISMap(data); 
      } 
     }, 
} 
</script> 
+0

這是正確的,看看文檔和選項合併:https://vuejs.org/guide/mixins.html#Option-Merging –