2016-05-10 8 views
0

私はVUEJSモジュール内でミックスインを使用したい:VueJSミックスインメソッド

モジュール

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

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

MIXIN

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(); 
     } 
    } 
} 

しかし、私はエラーを取得し、Googleマップという。 initGISMapは関数ではありません。コンポーネント内でmixinのメソッドを使用するにはどうすればよいですか?

+0

私はこれでmixinを参照する必要があると思います。モジュールthis.GoogleMaps.initGISMAP(data) – vbranden

答えて

5

- 私は)ミックスインを使用する場合

、あなたがメソッドMixinName.methodを(参照しないニーズを解釈する際に作られた正しい間違いを編集 - あなたから返されたメソッドやプロパティ - それはこの「ちょうどですミックスインとは、最初の注文、つまり、話すので、彼らは 'this'に縛られています。

<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 –