מעבר לווידג'ט החדש של ההשלמה האוטומטית

מדריך ההעברה הזה מיועד למפתחים שיש להם שילוב עם הווידג'ט Place Autocomplete (גרסת טרום-השקה) לפני גרסה 3.59.8. במדריך הזה מוסבר אילו שינויים צריך לבצע כדי להשתמש בגרסה העדכנית ביותר.

השינויים

• השם של האירוע gmp-placeselect השתנה ל-gmp-select.
• האירוע gmp-select מחזיר עכשיו מופע של placePrediction ולא מופע של place. ‫PlacePrediction.toPlace() מחזירה את האובייקט Place המתאים.
• האירוע gmp-requesterror מתקיים עכשיו gmp-error.

שלבים להעברה

כדי להעביר את השילוב של ווידג'ט ההשלמה האוטומטית למקומות לגרסה האחרונה: פועלים לפי השלבים הבאים:

1. מוודאים ש-Places API (חדש) מופעל בפרויקט ב-Cloud Console.
2. מוסיפים את Places API (New) לרשימת ההגבלות על ממשקי ה-API של מפתח ה-API שבו אתם משתמשים.
3. בסביבת הפיתוח, מבצעים את השינויים הבאים ובודקים אותם:

עדכון של רכיב event listener

מחליפים את gmp-placeselect ב-gmp-select כמו שמוצג בקטעי הקוד הבאים:

לפני

autocompleteElement.addEventListener('gmp-placeselect', (event) => {
  console.log(event.place);
});

אחרי

autocompleteElement.addEventListener('gmp-select', (event) => {
  console.log(event.placePrediction.toPlace());
});

החלפת המילה componentRestrictions במילה includedRegionCodes

משנים מופעים של componentRestrictions לשימוש בשדה includedRegionCodes, כמו בדוגמאות הבאות.

לפני

const autocompleteElement = new google.maps.places.PlaceAutocompleteElement({
  componentRestrictions: {country: ['US']},
  ...
});

אחרי

const autocompleteElement = new google.maps.places.PlaceAutocompleteElement({
  includedRegionCodes: ['US'],
  ...

החלפת המילה types במילה includedPrimaryTypes

משנים מופעים של types לשימוש בשדה includedPrimaryTypes, כמו בדוגמאות הבאות.

לפני

const autocompleteElement = new google.maps.places.PlaceAutocompleteElement({
  types: ['restaurant'],
});

אחרי

const autocompleteElement = new google.maps.places.PlaceAutocompleteElement({
  includedPrimaryTypes: ['restaurant'],
});

החלפת המילה gmp-requesterror במילה gmp-error

משנים את המופעים של gmp-requesterror ל-gmp-error, כמו שמוצג בקטעי הקוד הבאים:

לפני

autocompleteElement.addEventListener('gmp-requesterror', (event) => {
  console.log('an error occurred');
});

אחרי

autocompleteElement.addEventListener('gmp-error', (event) => {
  console.log('an error occurred');
});