0

大家好，我在实现谷歌自动完成时出错。所以这是场景在蓝色上它工作正常但是当我把它换成红色时它不工作 在蓝色上它工作正常但是当我将它替换为红色时它不工作 结果 现在当我把它放在红色箭头指向的线上时我得到了这个错误 在此处输入图像描述

作为参考我使用这个： https://www.npmjs.com/package/vue-google-autocomplete 我也试过这个 https://medium.com/dailyjs/google-places-autocomplete-in-vue-js- 350aa934b18d

它工作正常，但是当我把它放在循环上时它不起作用。安装状态似乎出错了。这是我的mounted()的代码

//this is the current I used
this.$refs.address.focus();
//this is for the 2nd one
/*this.autocomplete = new google.maps.places.Autocomplete(
      (this.$refs.autocomplete),
      {types: ['geocode']}
    );
    this.autocomplete.addListener('place_changed', () => {
      let place = this.autocomplete.getPlace();
      let ac = place.address_components;
      let lat = place.geometry.location.lat();
      let lon = place.geometry.location.lng();
      let city = ac[0]["short_name"];

      console.log(`The user picked ${city} with the coordinates ${lat}, ${lon}`);
    });*/
4

1 回答 1

1

用这个替换你里面的行mounted：

if(this.$refs.address) this.$refs.address.focus();

因为自动完成组件被放置在里面v-for，所以当WorkHistory.vue组件被挂载时，它不知道是什么this.$refs.address，除非work_history_data至少有 1 个项目。

于 2018-09-12T02:38:54.413 回答