vue 父子传值,子页面没有实时刷新的问题

时间:2024-01-20 15:45:15

在做高德地图的时候,发现列表点击编辑的时候,地图不能实时更新:

vue 父子传值,子页面没有实时刷新的问题

<el-form-item label="门店坐标:" :label-width="formLabelWidth">
<div class="mapcontainer">
<my-map :latitude.sync="temp.latitude" :longitude.sync="temp.longitude"></my-map>
</div>
</el-form-item>
代码传值给地图,后来添加了.sync
然后在子页面也就是地图页面进行监听:
watch: {
latitude(value,oldvalue){
this.loadmap()
},
longitude(value,oldvalue){
this.loadmap()
}
},
然后就可以拉~
PS:后面操作中发现,由于地图本身的原因,经度纬度监听会出现一直变动的问题,考虑到我们主要是从列表页到详情页,所以这种时候我们可以选择监听列表选中的ID。