React和谷歌的自動完成服務和取回郵政編碼

我有幾個問題與谷歌的自動完成位置服務。有兩種不同的方法，這兩者導致我的問題：React和谷歌的自動完成服務和取回郵政編碼

選項1個使用「反應 - 地方 - 自動完成」，並應用擴展在必要時：

handleInputChange(event) { 
    this.props.inputProps.onChange(event.target.value) 
    if (!event.target.value) { 
     this.clearAutocomplete() 
     return 
    } 
    this.autocompleteService.getPlacePredictions({ ...this.props.options, input: event.target.value }, this.autocompleteCallback) 
    }

上面叫我autocompleteCallback法預測其是很棒的。我有街道地址，城市，州，國家，但不是郵政編碼。也許我應該在選擇其中一個預測然後獲取郵政編碼信息後再打第二個電話？我從谷歌沒有任何現場那麼將從地址經過取郵政編碼雖然

選項2A：

method1(a1, a2, a3) { 
     //do state things because method1 is bound in the constructor 
    }; 
... later .... 
    var input = document.getElementById('my-input-id'); 
    var options = { 
     types: ['address'], 
     componentRestrictions: { 
      country: 'us' 
     } 
    }; 
    var autocomplete = new google.maps.places.Autocomplete(input, options); 
    google.maps.event.addListener(autocomplete, 'place_changed', this.method1);

選項2B

google.maps.event.addListener(autocomplete, 'place_changed', function() { 
     place = autocomplete.getPlace(); 
     //call states 
    })

我與方案2的第一部分問題是，雖然我們打方法1，並且我可以訪問道具/狀態，但變量autocommpleten超出了範圍，因此我無法獲取地址。

我的問題與選項2，第二部分，是我沒有看到一種方式來訪問一個addlistener方法內部的狀態。

我覺得我的選擇1是最合理的解決方案，但由於某種原因，谷歌決定不包括郵政編碼。另外，使用聽衆會讓我感到不安。

來源

2017-04-18 user2589339

我發現周圍的工作是更優雅，保留了使用父類的能力「反應 - 地方 - 自動完成」在我handleselect，我添加以下代碼：

googleMapsClient.geocode({ 
     address: address 
    }, this.method1);

其中googlemapsclient = require（'@ google/maps'）。createClient（{key：'...' }）;

它調用另一個不理想的異步方法，但它保留了我的其他信息。

來源

2017-04-18 20:21:33 user2589339

React和谷歌的自動完成服務和取回郵政編碼

回答

相關問題