Google.maps.event.addDomListener() устарел, вместо него используйте стандартный метод addEventListener() : Ошибка автозаполнения Google Place

Я пытаюсь добавить автопредложение места Google, я скопировал код с сайта разработчика, чтобы попробовать, но получил ошибку : google.maps.event.addDomListener() устарел, вместо него используйте стандартный метод addEventListener().. Также я не получаю никаких предложений о местах.

https://developers.google.com/maps/documentation/javascript/places-autocomplete

google.maps.event.addDomListener(window, 'load', initializeAutocomplete);

я также добавил скрипт <script src="https://maps.googleapis.com/maps/api/jskey=api_key&libraries=places"></script>

Я реализовал то же самое в одном html, он работал успешно, но когда я использовал его на кнопке, которая открывает всплывающее окно ( форма, которая имеет place-input), он выдал мне эту ошибку.

Примечание : Я также пробовал addEventListener но это дает мне ошибку : google.maps.event.addEventListener is not a function

Есть ли у вас идеи, почему я получаю эту ошибку, и как я могу это исправить?

Поскольку функция addDomListener() устарела, используйте вместо нее стандартный метод addEventListener(), сделать это можно следующим образом:

window.addEventListener('load', initializeAutocomplete)

Замените аналогичным образом во всех необходимых местах.

google.maps.event.addDomListener(<OBJECT>,<EVENT>,<FUNCTION>);

to

<OBJECT>.addEventListener(<EVENT>,<FUNCTION>);

Это не так просто, как просто "Replace addDomListener" с помощью copy/paste. lol. это было бы неплохо, не так ли?

Также следует отметить, что при загрузке API Google Maps вы можете просто передать функцию initializeAutocomplete через URL следующим образом:

<script type='text/javascript' src='https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE&libraries=places&callback=initAutocomplete'></script>

Итак, это так же просто, как прикрепить к этому url обратный вызов GET var: https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE&callback=initAutocomplete

В вашем примере просто добавьте &callback=initAutocomplete = done.

полная остановка

Рассмотрим другие случаи - рассмотрим следующее использование. Это (из старого архива примеров google maps) больше не будет работать: enter image description here

 google.maps.event.addDomListener( radioButton, 'click', function() { 
    autocomplete.setTypes( ['establishment'] ); 
  // this causes google.maps.event.addDomListener() is deprecated warning
 });

Это никогда не сработает Потому что нет google.maps.event.addEventListener

 google.maps.event.addEventListener( radioButton, 'click', function() { 
    autocomplete.setTypes( ['establishment'] ); 
   });

// lands you: Uncaught TypeError: google.maps.event.addEventListener is not a function

Вам нужно переосмыслить+переписать следующим образом:

document.getElementById(radioButton).addEventListener('click', function(e) {
    autocomplete.setTypes( ['establishment'] ); // yellowstone PARK
    autocomplete.setTypes( ['address'] ); // some address with yellowstone st
    });

теперь это снова работает как ожидалось, без ошибок google.maps.event.addDomListener() is deprecated enter image description here

Так что в вашем случае, если вы по какой-то причине не можете добавить &callback=initAutocomplete в ваш URL или не хотите - тогда рассмотрим следующее:

// notworksolutions
google.maps.event.addDomListener(window, 'load', initializeAutocomplete);
google.maps.event.addEventListener(window, 'load', initializeAutocomplete);

// solution that work
window.addEventListener('load', (event) => { initializeAutocomplete(); });

Это в Google Maps Issue Tracker помечено как исправленное. Исправление должно появиться в ближайшем выпуске.

Вернуться на верх