Javascript 如何限制谷歌自动完成结果仅限于城市，州，国家，邮编？

我正在使用react places autocomplete包。目前，我仅限于该地区和美国

现在我试着只限于城市、州、国家和邮政

问题：

如果我使用地区，它也会显示城镇，但我只需要搜索城市、州、国家和邮政编码

如果我使用城市，它将显示城市、州和国家，但zip不会显示在搜索中。

预期产出 我想输出像城市，州，国家和邮政编码的地方，城镇，次大陆

代码

import PlacesAutocomplete, {
    geocodeByAddress,
    getLatLng,
  } from 'react-places-autocomplete';

const searchOptions = {
    types: ['(regions)'],
    // types: ['(cities)'],
    componentRestrictions: {country: "us"}
}

 handleChange = address => {
    this.setState({ address });
  };

  handleSelect = address => {
    geocodeByAddress(address)
      .then(results => getLatLng(results[0]))
      .then(latLng => console.log('Success', latLng))
      .catch(error => console.error('Error', error));
  };

render() {
    const renderFunc = ({ getInputProps, suggestions, getSuggestionItemProps, loading }) => (
            <div>
                <input
                    className="location-field"
                    {...getInputProps({
                        placeholder: 'Search Places ...',
                        className: 'input-box location-search-input form-control field-list',
                    })}
                />
                <div className="autocomplete-dropdown-container">
                    {loading && <div>Loading...</div>}
                    {suggestions.map(suggestion => {
                        const className = suggestion.active
                            ? 'suggestion-item--active'
                            : 'suggestion-item';
                        // inline style for demonstration purpose
                        const style = suggestion.active
                            ? { backgroundColor: '#fafafa', cursor: 'pointer', margin: '0px 0px 0px 10px', width: '70%' }
                            : { backgroundColor: '#ffffff', cursor: 'pointer', margin: '0px 0px 0px 10px', width: '70%'};
                        return (
                            <div
                                {...getSuggestionItemProps(suggestion, {
                                    className,
                                    style,
                                })}
                            >
                                <span>{suggestion.description}</span>
                            </div>
                        );
                    })}
                </div>
            </div>
        );

    retrun <div>
        <PlacesAutocomplete
        value={this.state.address}
        onChange={(address)=>this.handleChange(address)}
        onSelect={(e)=>this.handleSelect(e, fieldConstants.region)}
        searchOptions={searchOptions}
        >
            {renderFunc}
        </PlacesAutocomplete>

    </div>
}

导入位置完成{
地理编码地址，
getLatLng，
}从“自动完成”开始；
常量搜索选项={
类型：['（区域）]，
//类型：['（城市）]，
组件限制：{国家：“美国”}
}
handleChange=地址=>{
this.setState（{address}）；
};
handleSelect=地址=>{
geocodeByAddress（地址）
。然后（results=>getLatLng（results[0]））
.then（latLng=>console.log（'Success'，latLng））
.catch（error=>console.error（'error'，error））；
};
render（）{
const renderFunc=（{getInputProps，suggestions，getSuggestionItemProps，loading}）=>(
{正在加载和正在加载…}
{suggestions.map（suggestion=>{
const className=suggestion.active
？“建议项--活动”
：“建议项目”；
//用于演示的内联样式
const style=suggestion.active
？{背景颜色：'#fafafafa'，光标：'指针'，边距：'0px 0px 0px 10px'，宽度：'70%'}
：{背景颜色：'#ffffff'，光标：'指针'，边距：'0px 0px 0px 10px'，宽度：'70%'；
返回(
{建议.说明}
);
})}
);
重新运行
this.handleChange（地址）}
onSelect={（e）=>this.handleSelect（e，fieldConstants.region）}
searchOptions={searchOptions}
>
{renderFunc}
}

只需阅读Google官方文档中关于

类型

参数的内容。除了

地理编码

和

建立

之外，不能将它们组合在一起，但这与不指定类型相同。任何自动完成返回邮政编码的示例？@MrUpsidown如果我们使用类型作为区域，那么它将返回邮政编码以及区域、子区域、州、国家。因此，这里我只想限制为zip、state、county和City。请编辑您的问题，以包括一个示例查询和结果，以及一个您期望的示例。只需阅读有关

类型

参数的官方Google文档。除了

地理编码

和

建立

之外，不能将它们组合在一起，但这与不指定类型相同。任何自动完成返回邮政编码的示例？@MrUpsidown如果我们使用类型作为区域，那么它将返回邮政编码以及区域、子区域、州、国家。因此，这里我只想限制为zip、state、country和cityPlease编辑您的问题，以包括示例查询和结果，以及您期望的示例。