Как я могу исправить места googe api initMap не является функцией? - PullRequest
0 голосов
/ 03 июля 2019

Мы используем API карт Google Maps на нашем сайте для нашего поля input.Предложение появляется, когда пользователь вводит в поле ввода

При загрузке страницы появляется сообщение об ошибке консоли:

Uncaught (in promise) Vc {message: "initMap is not a function", name: "InvalidValueError", stack: "Error↵    at new Vc (https://maps.googleapis.com/m…s=places%2Cgeometry&callback=initMap&ver=1:145:96"}
Promise.then (async)
Oh @ js?key=some_valid_random_key&libraries=places%2Cgeometry&callback=initMap&ver=1:145
google.maps.Load @ js?key=some_valid_random_key&libraries=places%2Cgeometry&callback=initMap&ver=1:21
(anonymous) @ js?key=some_valid_random_key&libraries=places%2Cgeometry&callback=initMap&ver=1:230

function initMap() {
  const autocompleteInputs = document.getElementById('autoaddress');
  const options = {
    types: ['address'],
    componentRestrictions: {
      country: "us"
    }
  };
  new google.maps.places.Autocomplete(autocompleteInputs, options);
}
<!doctype html>
<html class="no-js" lang="">

<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <title></title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <script type="text/javascript" src="http://example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4"></script>
</head>

<body>


  <form action="/form-action" method="GET">

    <input id="autoaddress" name="address" type="text" placeholder="Address">

    <button class="button button__primary">Show Address</button>

  </form>

  <script type="text/javascript" src="http://example.com/wp-content/themes/divi/scripts/custom.js"></script>
  <!-- where initmap function exists -->
  <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=some_valid_random_key&amp;libraries=places%2Cgeometry&amp;callback=initMap&amp;ver=1"></script>

</body>

</html>

Любая помощь с благодарностью.Спасибо

1 Ответ

1 голос
/ 03 июля 2019

Пожалуйста, убедитесь, что ваш скрипт должен загружаться до initMap() функции, также используйте async и defer в скрипте, как показано ниже.

<script async defer
                src="https://maps.googleapis.com/maps/api/js?key=some_valid_random_key&amp;libraries=places%2Cgeometry&amp;callback=initMap&amp;ver=1">
        </script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...