让 Google Places 与 React localhost 一起工作答案

【问题标题】：Making Google Places work with React localhost让 Google Places 与 React localhost 一起工作
【发布时间】：2018-03-21 18:32:48
【问题描述】：

Google Places API 脚本链接位于 index.html 的底部。当我访问 localhost:3000 时，代码可以正常工作，但是当我转到 localhost:3000/set-location 时，它会停止工作，就好像它不存在一样。我正在使用 Webpack，它是开发服务器

webpack.js

App.js

Header.js

index.html

index.js

【问题讨论】：

您是否检查了源代码以查看脚本是否存在？你得到什么错误信息？
当我查看源代码时，它告诉我无法获取 /edit-profile。但是引导程序可以按预期在页面上工作。我假设 Webpack 编译物理文件而不是远程脚本？或者它与 React Router 有关。我可以在浏览器中查看 localhost 的页面源代码，但不能查看 localhost:3000/register 等其他 url。
如果脚本链接在您的索引文件中，它应该始终可以访问。它应该与 webpack 或 react router 无关。您可以发布所有相关文件中的代码吗？帮助您的信息太少
@ThunderDev 我已经添加了文件。谢谢！

标签： reactjs webpack localhost google-places

【解决方案1】：

由于 Google Places API 脚本不依赖于 DOM，因此我将其放在了头部。然后在componentDidMount()中动态加载autocomplete.js：

 componentDidMount(){
    const script = document.createElement("script");
    script.src = "./assets/js/autocomplete.js";
    document.body.appendChild(script);
  }

【讨论】：