

在页面选择设备位置后打印this.form.roadWayId已更新,但是页面没有更新显示
问题原因:由于JavaScript的限制,vue不能检测对象属性的添加或者删除。
对于已经创建的实例,Vue不允许动态添加根级别的响应式属性。但是可以使用Vue.set(object,propertyName,value)方法嵌套兑现添加响应式属性。
因为select绑定的是form中的roadWayId,roadWayId最初没有定义在form中,所以roadWayId不是响应式的。
解决方法一:可以直接在form中定义一个roadWayId,这样roadWayId就成了响应式的。

解决方法二:使用this.$set()来显式更新对象的属性。
this.$set(this.form, 'roadWayId', '')
网友评论