this.$router.push() is not recognizing inside google map place_changed function

Question

I have a textbox which is connected to google map place autocomplete function . I called the new google.maps.places.Autocomplete() inside vue mounted property . Based on the search results i want to redirect my page to a search filter page calling this.$router.push() function . But I don't know why this.$router.push() is not recognizing inside google map place_changed().

I called this.$router.push() inside mounted(){}. Its working fine but I need to recognize this.$router.push() inside place_changed().

<input id="modal-filters-Main"
                                        placeholder="Enter an address, neighborhood, city or ZIP code"
                                        class="typeahead form-control form-ready-for-bubble" >

var SearchBox = new google.maps.places.Autocomplete(document.getElementById('modal-filters-Main'));
            SearchBox.addListener('place_changed', function() {
                 this.place = SearchBox.getPlace();
                 this.formatter = this.place.formatted_address;
                 this.lower = this.formatter.toLowerCase();
                 this.modified = this.lower.replace(", ","_");
                this.$router.push('/listing/'+this.modified);
                // window.location.href = '/listing/'+modified;
            });

Change `function() { ... }` to `() => { ... }` – Phil Aug 28 '19 at 02:55 — Phil, Aug 28 '19 at 02:55

score 0 · Accepted Answer · answered Aug 28 '19 at 06:47

0

If you want to retain your code you can add this inside your function.

let $this = this

but it seems dirty and old, better change function to ()=>

answered Aug 28 '19 at 06:47

Renato Manalili

480
3
8

this.$router.push() is not recognizing inside google map place_changed function

1 Answers1