React 谷歌位置不适用于 Hooks

【问题标题】：React google location doesnt work with HooksReact 谷歌位置不适用于 Hooks
【发布时间】：2020-01-25 10:04:25
【问题描述】：

我在我的项目中尝试了 react google api。我在 Google Cloud 中创建了计数并且我有 api。我有这个代码：

import { GoogleComponent } from "react-google-location";
export default function Home() {

  const API_KEY_GOOGLE = "XXXXX";
  return (
    <div className="home">
      <h1>GHome</h1>

      <div>
        <GoogleComponent
          apiKey={API_KEY_GOOGLE}
          language={"en"}
          country={"country:in|country:us"}
          coordinates={true}
          //   locationBoxStyle={"custom-style"}
          //   locationListStyle={"custom-style-list"}
          onChange={e => {
            setPlace({ place: e });
          }}
        />
      </div>
    </div>
      );
}

并在控制台中显示：

【问题讨论】：

请勿发布代码、数据、错误消息等的图片 - 将文本复制或输入到问题中。 How to Ask

标签： reactjs react-hooks

【解决方案1】：

如果应用程序不包含任何其他部分，例如 <ul> 和 <li> 组合或使用 map() 生成其他 HTML 元素而不添加 key 属性，那么问题很可能是通过country 属性。

基于react-google-location的文档：

使用多种语言

像这样在国家对象中传递键值对：

country={in|country:pr|country:vi|country:gu|country:mp}

您的country 属性具有{"country:in|country:us"}。也许值得测试如下：

<GoogleComponent
    apiKey={API_KEY_GOOGLE}
    language={"en"}
    country={"in|country:us"}
    coordinates={true}
    onChange={e => {
       setPlace({ place: e });
    }} />

或者我的第二个猜测：

<GoogleComponent
    apiKey={API_KEY_GOOGLE}
    language={"en"}
    country={"in|country:in|country:us"}
    coordinates={true}
    onChange={e => {
       setPlace({ place: e });
    }} />

希望对你有帮助！

【讨论】：