Question

我正在尝试将Google Maps API集成到我的ReactJS和Cordova项目中，以便我可以使用地方自动填充功能。我不需要显示整个地图。目前，我正在使用脚本代码将Google Maps API添加到我的项目中。但是，我想避免这种情况，安装它，并像我所有其他React库一样导入它。有没有办法做到这一点？

Answer 1

您可以通过javascript;

加载它

jQuery模块 -

`connectionString="Data Source=(local);AttachDbFilename=|DataDirectory|\TaskManagerDB.mdf;Initial Catalog=TaskManagerDB;Integrated Security=True" providerName="System.Data.SqlClient" />
  </connectionStrings>`

loadMapsApi（）函数 -

(function (global) {
    "use strict";

    function onDeviceReady () {
        document.addEventListener("online", onOnline, false);
        document.addEventListener("resume", onResume, false);
        loadMapsApi();
    }

    function onOnline () {
        loadMapsApi();
    }

    function onResume () {
        loadMapsApi();
    }

    function loadMapsApi () {
        if(navigator.connection.type === Connection.NONE || google.maps) {
            return;
        }
        $.getScript('https://maps.googleapis.com/maps/api/js?key=API_KEY&sensor=true&callback=onMapsApiLoaded');
    }

    global.onMapsApiLoaded = function () {
        // Maps API loaded and ready to be used.
        var map = new google.maps.Map(document.getElementById("map"), {});
    };

    document.addEventListener("deviceready", onDeviceReady, false);

})(window);

这种方式最适合处理离线。

Running on Coliru

Answer 2

总有一个lib你就是:) this是google的第一个结果。享受：）

Answer 3

我已经在地图组件中使用JavaScript将脚本标签加载到DOM中。我知道该解决方案最终仍会使用脚本标签，但我发现它是最优雅的解决方案。

count|text_id|trigram_id 
   1       1        1
   1       1        2
   0       1        3
   1       2        1
   1       2        2
   1       2        3
   0       3        1

此方法还需要定义google api链接所需的回调。我将此逻辑放在了将回调绑定到窗口对象的useEffect挂钩中。

in

有没有办法将Google Maps API导入到没有脚本标记的反应中？

3 个答案: