VueJS Web 应用程序中的 Google Maps API 弃用错误：utc_offset 自 2019 年 11 月起已弃用，并将于 2020 年 11 月关闭

Question

我目前在我的 VueJS Web 应用程序中收到以下错误。

utc_offset 自 2019 年 11 月起已弃用，并将于 2020 年 11 月关闭。请改用 utc_offset_minutes。

根据Google Maps API 文档：

Places 字段 opening_hours.open_now 和 utc_offset 自 2019 年 11 月 20 日起已弃用，并将于 2020 年 11 月 20 日关闭。这些字段仅在 Places Library Maps JavaScript API 中弃用。本指南向您展示如何更新代码以停止使用这些字段。

唯一的问题是，我绝对不会直接在我的 Vue 应用程序中的任何地方使用 utc_offset。我通过在我的应用程序中对“utc_offset”这个词进行全局查找来验证这一点。我也不记得访问过那个特定的属性。

如果我没有使用该属性，为什么会收到此弃用警告？

下面是我的堆栈跟踪的样子：

以下代码片段显示了该clearAllCardsAndFilters方法的作用。

methods: {
    clearAllCardsAndFilters() {
        this.clearActiveCardListingId();
        this.clearFilterCards();
    },
    clearActiveCardListingId() {
        this.$store.commit('clearActiveCardListingId');
    },

下面的代码片段展示了clearActiveCardListingIdVuex 中的 mutation 做了什么。它只是将activeCardListingIdVuex 中的属性设置为null.

    clearActiveCardListingId(state) {
        state.activeCardListingId = null;
    },

Answer 1

如果您使用的是 VUE2-google-maps，那么您可以通过以下方式使用 google map 组件：

<GmapAutocomplete
 @place_changed="setPlace"
 :options="{fields: ['geometry', 'formatted_address', 'address_components']}">
</GmapAutocomplete>

Answer 2

我使用 Google Places API 时未指定任何字段。一旦您按照以下方式指定字段，此弃用警告就会消失。确保避免将“utc_offset”指定为字段，否则消息将会返回。

new google.maps.places.PlacesService(attrContainer).getDetails({
  placeId: '...',
  fields: ['opening_hours','utc_offset_minutes'],
  }, function (place, status) {
    if (status !== 'OK') return; // something went wrong
    const isOpenAtTime = place.opening_hours.isOpen(new Date('December 17, 2020 03:24:00'));
    if (isOpenAtTime) {
        // We know it's open.
    }

    const isOpenNow = place.opening_hours.isOpen();
    if (isOpenNow) {
        // We know it's open.
    }
});