Added the option to specify which fields to fetch in the PlaceResult object (#103)

* Added the option to specify which fields to fetch

* Updated docs

Author: liliumdev

README.md

@@ -13,7 +13,7 @@ I have tried to use different Vue Google Autocomplete components, but did not fi
 * Load more than one autocompletion inputs (I could not achieve this with existing vue components)
 * Getting geolocation data (latitude, longitude) for found address object along with other address data (country, city, state, county, street, house number, zip code). So no need to do additional geocode request on backend side.
 * No external dependencies
-* You can get access to underlying [PlaceResult object](https://developers.google.com/maps/documentation/javascript/reference#PlaceResult) to get more details about found location.
+* You can get access to underlying [PlaceResult object](https://developers.google.com/maps/documentation/javascript/reference#PlaceResult) to get more details about found location. You are able to specify the specific fields you want to fetch from the PlaceResult object.
 * You can limit results to specific country or use users geolocation data
 
 ## Installation
@@ -93,6 +93,15 @@ Types supported in place autocomplete requests. [More info](https://developers.g
 
 You may find [this example](#correct-usage-of-the-types-parameter) helpful.
 
+
+#### fields
+Type: `Array`
+Default: `['address_components', 'adr_address', 'alt_id', 'formatted_address', 'geometry', 'icon', 'id', 'name', 'permanently_closed', 'photo', 'place_id', 'scope', 'type', 'url', 'utc_offset', 'vicinity']`
+
+Set which data fields to return in the PlaceResult from the Google Autocomplete API when the user selects a place. [Google Autocomplete API by default returns all available data fields](https://developers.google.com/maps/documentation/javascript/places-autocomplete#get_place_information) for the selected place, which may result in additional charges and thus the API users might pay for data they don't need. This package sets a sensible default for the fields value, fetching only the Basic Data fields which do not result in any additional charges. If you want to fetch other fields in addition to the default ones, make sure that the array you pass in to the `fields` prop contains the default fields listed above, and not only the additional fields you want to fetch.
+
+Refer to [this page](https://developers.google.com/maps/billing/understanding-cost-of-use#data-skus) for more details on how certain data fields are billed.
+
 #### country
 Type: `String`|`Array`
 Default: null

src/VueGoogleAutocomplete.vue

@@ -31,6 +31,17 @@
     const REGIONS_TYPE = ['locality', 'sublocality', 'postal_code', 'country',
         'administrative_area_level_1', 'administrative_area_level_2'];
 
+    /*
+      By default, we're only including basic place data because requesting these 
+      fields place data is not additionally charged by Google. Please refer to:
+
+      https://developers.google.com/maps/billing/understanding-cost-of-use#basic-data
+    */
+    const BASIC_DATA_FIELDS = ['address_components', 'adr_address', 'alt_id', 
+        'formatted_address', 'geometry', 'icon', 'id', 'name', 
+        'permanently_closed', 'photo', 'place_id', 'scope', 'type', 'url', 
+        'utc_offset', 'vicinity'];
+
     export default {
         name: 'VueGoogleAutocomplete',
 
@@ -57,6 +68,13 @@
             default: 'address'
           },
 
+          fields: {
+            type: Array,
+            default: function() {
+              return BASIC_DATA_FIELDS;
+            },
+          },
+
           country: {
             type: [String, Array],
             default: null
@@ -143,6 +161,8 @@
                 options
             );
 
+          this.autocomplete.setFields(this.fields);
+
           this.autocomplete.addListener('place_changed', this.onPlaceChanged);
         },