如何从react-geosuggest中提取邮政编码值？

Question

Short description

我试图使用onSuggestSelect组件从npm react-geosuggest prop提供的结果中捕获City，State和Zipcode值。你可以在这里找到相关信息：https://www.npmjs.com/package/react-geosuggest

Expected results

我创建了一个处理程序来处理onSuggestSelect返回的更改，并在该处理程序中我试图捕获我需要将其保持为状态所需的数据。使用以下内容：

handleOnSuggestSelect(suggestion) {
  this.setState({
    address: suggestion.label
  });
}

我希望suggestion.label值可以存储整个地址：1234 Maple Street, Miami, FL, 33010, USA

Actual results

而不是1234 Maple Street, Miami, FL, 33010, USA，我看到的是：1234 Maple Street, Street的值出现了。为什么,Street的价值出现在最初的街道地址之后而不是其他预期信息（城市，州，邮政编码）？

Additional Information

如何从标签中获取不同的地址组件？特别是城市，州和邮政编码？

您可以看到我如何设置react-geosuggest组件，如我在此处发布的答案所述：Get input value of react-geosuggest input field

Answer 1

要获得handleOnSuggestSelect中的实际地址组件，您可以像这样访问它们：

handleOnSuggestSelect(suggest) {
  if (!suggest.gmaps) {
    return;
  }

  const components = suggest.gmaps.address_components;

  const address = {
    street: this.findAddressComponent(components, 'street_number', 'short_name') + ' ' + this.findAddressComponent(components, 'route', 'short_name'),
    city: this.findAddressComponent(components, 'locality', 'short_name'),
    state: this.findAddressComponent(components, 'administrative_area_level_1', 'short_name'),
    zip: this.findAddressComponent(components, 'postal_code', 'short_name'),
  }

  this.setState({
    address
  });
}

findAddressComponent(components, type, version) {
  const address = components.find(function(component) {
    return (component.types.indexOf(type) !== -1);
  });

  return address[version];
}

尝试从上面获取标签中的地址组件，而不是尝试从标签获取地址组件