记录下，vue2的响应式问题-对象赋值失去响应式

问题背景：在一次项目中，需要对数据回显并编辑的情况下，重新编辑的新数据不生效。----比如单选框想要选另一个值选不动

问题分析：在数据回显时将表单值的对象重新赋值，则回显数据中没有表单对象的值就会失去，下面的例子中isneedRepair失去响应式

export default {
	data() {
	  advert: {
        isneedRepair: '否',
        advertisementType: 'video',
        advertisementContent: '',
        position: '',
        showDuration: '',
        putInDate: '',
        putInTime: '2022-12-09',
        needRepair: false,
        repairAmount: '',
        userSolution: {}
      },
	},
	methods() {
		// 接口获取数据
		async getData() {
			cosnt res = await requestAPI('url')
			// 解决方案一 使用Object.assign函数，不是直接覆盖 👍推荐使用--可以不用每个属性都set进去
			// this.advert = Object.assign(this.advert, data);
			
			this.advert = res.data; // ❌ 错误的源头就是直接赋值（给覆盖全部值了）	
			/* isneedRepair这个属性接口的拿到是没有的，导致advert直接失去isneedRepair这个属性，
			再次赋值就想要this.$set设置才有响应式 */
			this.advert.isneedRepair = data.adminSolution.needRepair ? '是' : '否';
			
			// 解决方法二 就是使用Vue的set方法动态添加回来
			// this.$set(this.advert, 'isneedRepair', data.adminSolution.needRepair ? '是' : '否');
		}
	}
	
}

vue2和vue3响应式的不同
参考一下这位博主https://blog.csdn.net/m0_45219210/article/details/127687632