javascript - 使用 vuetify-google-autocomplete 和 google map api

Question

我正在尝试在 vue.js 项目中使用 vuetify-google-autocomplete，我按照教程中的方式执行了所有操作(您可以查看我的 github 存储库: https://github.com/droruri/street-food-app-pwa ) 我在控制台上收到这些错误:

    [Vue warn]: Missing required prop: "googleApiKey"

    found in

    ---> <VuetifyGoogleAutocomplete>
   <VForm>
     <AddRestaurant> at src\components\AddRestaurant.vue
       <VContent>
         <VApp>
           <App> at src\App.vue
             <Root>

    [Vue warn]: Missing required prop: "value"

    found in

    ---> <VuetifyGoogleAutocomplete>
   <VForm>
     <AddRestaurant> at src\components\AddRestaurant.vue
       <VContent>
         <VApp>
           <App> at src\App.vue
             <Root>

此外，我还收到了与 google map API 相关的下一个错误，尽管我只包含了一次 api key :

    You have included the Google Maps API multiple times on this page. This 
    may cause unexpected errors.

    Google Maps API warning: NoApiKeys 
    https://developers.google.com/maps/documentation/javascript/error-
    messages#no-api-keys

感谢您的帮助!

Answer 1

您的项目正在使用 vuetify-google-autocomplete 的 ALPHA 版本并且 API 发生了变化。

删除谷歌地图<script>您的标签index.html .

错误消息[Vue warn]: Missing required prop: "googleApiKey"告诉您为 VuetifyGoogleAutocomplete 提供属性(您的 Google map API key ):

```

  <vuetify-google-autocomplete
          id="add-restaurant"
          classname="form-control"
          label="כתובת"
          @placechanged="getAddressData"
          google-api-key="my-google-maps-api-key"
        >
        </vuetify-google-autocomplete>

```

发行说明:https://github.com/MadimetjaShika/vuetify-google-autocomplete/releases/tag/v2.0.0-alpha.1