Why vue compnent property doesn;t update When open it secodnd time?-CodePudding

I have vue component which data() property center2 which basicallly lng,lat object. This property supposes to update when every location changes. but it get updated for the very first time when I open the component. for every next attempt it only shows default values I have assigned.

data property

data()
{
     center2: { lat: 0, lng: 0 },
}

This is how updating it with location inside location watcher

  this.center2.lat = Number(location.latitude);
       this.center2.lng = Number(location.longitude);
       console.log('MY',this.center2);

I can see in console lat long are coming nicely

What is the reason?

CodePudding user response：

In Vue2, you might want to try returning center2 inside data(). It looks like below:

data() {
  return {
    center2: {
      lat: 0,
      lng: 0
    }
  }
}

Then center2 should be updated normally along with the watcher.

CodePudding user response：

this.$set(this.center2,'lng',Number(location.longitude))

The document address https://cn.vuejs.org/v2/api/#vm-set