Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How can I set a default address when page loads? #136

Open
debanjanpatra opened this issue May 20, 2020 · 2 comments
Open

How can I set a default address when page loads? #136

debanjanpatra opened this issue May 20, 2020 · 2 comments

Comments

@debanjanpatra
Copy link

No description provided.

@antoineguillaume
Copy link

Here is how I did it. I added the property "value" to the component and I linked it to a computed property in my view.

<vue-google-autocomplete
  :types="getType"
  :value="setAddressData"
  @placechanged="getAddressData
>
</vue-google-autocomplete>
computed: {
  getType () {
    return '(cities)'
  },
  setAddressData () {
    return this.getType === '(cities)' ? `${this.address.city}, ${this.address.country}` : `${this.address.line1}, ${this.address.city}, ${this.address.country}`
  }
}

Here getType computed property is fixed for the example but in my case it's dynamic. Then, the way we want to display the address in the autocomplete field depends on that. And this.address object is your default address.

Hope this helps !

@ghost
Copy link

ghost commented Sep 12, 2022

@antoineguillaume I am trying to accomplish something similar (a user can update their existing address), but the computed solution you posted isn't working, and I think it's because my autocomplete component doesn't show to the user unless they click a button, and then it expands using v-if, do you have any ideas on how to get the component to have a default value (just a string of text) without using the update() method in mounted() or without using the computed solution you posted above?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants