Vue+Element-ui中el-switch组件，改变数据状态且初始化

el-switch使用过程中，通过触发开关按钮，数据更改成功，但是按钮一直是默认的一种状态，因此需要数据和开关状态同时改变，所以每次操作对应的信息时要初始化按钮开光状态。

以下是效果图

此处是一个el-dialog真的弹出框，此处省略与本要点无关的代码，只放el-switch的相关代码，此处的data04.Content是请求数据所传的值，用CusData 代替data04.Content，而data04.Content中包括了开关按钮需要改变的数据字段IsOutOfContact

			
				
					
					
				
			
			
        
        确 定
      

总结：开光按钮实现事件触发很容易，但是要保证数据和按钮开光状态同步，容易踩坑，以下是点击编辑以后会触发弹框弹出，且需要数据和状态同步改变，由于active-value和inactive-value所传的值得类型是String，因此在请求数据之前需要将数据转化为String类型

因此：在data04.Content中将IsOutOfContact需要转化为String类型

rowDataEdit02(index, row) {
				//console.log(typeof(row.IsOutOfContact));
				this.dialogParams02.visible = true
				this.data04.Method = 'U'
				this.data04.Content = {
					Code: row.Code,
					LineID: row.LineID,
					UserCode: row.UserCode,
					UserName: row.UserName,
					CellPhoneNO: row.CellPhoneNO,
					PhoneNO: row.PhoneNO,
					Position: row.Position,
					DefaultContacts: row.DefaultContacts,
					//将IsOutOfContact需要转化为String类型
					IsOutOfContact: String(row.IsOutOfContact)
				}
				//console.log(typeof(this.data04.Content.IsOutOfContact));
			},

然后再根据IsOutOfContact值的不同进行相对应的渲染修改

总结：在请求数据时多在控制台调试，需要将请求的数据放在请求数组中，且将数据初始化，如果初始化没问题再查看请求的数据类型是否与文档中的一致，此处之所以用String，其他两种数据类型和其他变量有冲突，用Boolean和Number会抛出错误。