【vue 项目】下拉框选中后，选择框没有显示问题

在做项目的时候遇到一个问题，下拉框选中后，显示框没有发生改变，于是在网上找了很多方法，我觉得下面这个方法最方便。
首先是监听选择框值改变，在改变时通过$set直接赋值

<el-form-item label="所属城市：" prop="city">
	<el-select
		v-model="addForm.city"
		placeholder="请选择城市"
		size="small"
		@change="selectCity"
	>
		<el-option v-for="item in cities" :key="item.id" :value="item.id" :label="item.name" />
	</el-select>
</el-form-item>

selectCity(val) {
	if (val) {
		this.$set(this.addForm, this.addForm.city, val)
	} else {
		this.$set(this.addForm, this.addForm.city, '')
	}
},

这里顺便讲一下$set的用法

$set 用来更新数组或对象

$set(参数1, 参数2, 参数3)
参数1：需要更新的数组或对象
参数2：数组的下标或者对象的属性名
参数3：更新的内容

var object = {
	id: '1',
	name: 'Mary',
	sex: '女',
}
this.$set(object, 'name', 'Lily')