问题描述:今天项目中遇到的一个bug,v-model绑定的值修改不了,导出问题的原因是初始化form对象值的时候,把medGroupDepCode这个值弄丢了,导致v-model双向绑定的时候找不到这个值,所以只能单项的显示这个值,而不能修改。具体详情,看代码:
async handleUpdate (row) {
console.log(row, 'row..')
this.handleMedGroupDepList()
this.spinning = true
row = JSON.parse(JSON.stringify(row))
this.$emit('getTreeselect', row)
this.formTitle = '修改' + this.deptTypeName
this.open = true
this.form = this.$toHumpObj(row)
this.form = JSON.parse(JSON.stringify(this.form))
if (this.deptType === 1 && this.form.extConfig) { // 医疗科室string转object回显
let medGroupDep = JSON.parse(this.form.extConfig).dept_code_med
this.form.medGroupDepCode = JSON.parse(JSON.stringify(medGroupDep.code || ''))
this.form.medGroupDepName = JSON.parse(JSON.stringify(medGroupDep.label || ''))
console.log(this.form.medGroupDepCode, 'form...')
}
const resDep = await listWorkspace({ isLimitDept: true })
if (resDep) {
this.wkspOptions = resDep.data.map(item => {
return {
value: item.code,
label: item.name
}
})
}
this.spinning = false
},
this.form = this.$toHumpObj(row)在这一行的时候,对form对象初始化赋值过了,但是row中并没有medGroupDepCode这个值,所以没有双向绑定上这个值,即使后面对this.form.medGroupDepCode这个值赋值了,也只是单向赋值,页面上可以展示出来,但是不能做修改操作。
解决方法:
1,在this.form.medGroupDepCode赋值后,再格式化操作一遍
2,this.form初始化赋值的时候,按照下面这样写就可以避免绑定不上了。
this.form = Object.assign({}, row, {medGroupDepCode: ''})