Vue组件页面渲染 字段无法格式化

错误场景

(下拉选框)服务状态字段显示为 数字0或1,执行格式化方法后无法生效.
 
 

解决

错误写法 value , serviceStatus字段目前还是varchar类型.

正确写法 :value , serviceStatus字段是int类型, 即可以正常格式化.

	<el-col :span="12">
	 <el-form-item label="服务状态" prop="serviceStatus" :formatter="serviceStatusFormat">
	    <el-select
	      disabled
	      v-model="editData.serviceStatus"
	      placeholder="请输入服务状态">
	      <el-option label="关闭" :value="0"/>
	      <el-option label="正常" :value="1"/>
	    </el-select>
	  </el-form-item>
	</el-col>

	// 格式化服务状态
	serviceStatusFormat(row, column) {
	   if (row.serviceStatus === 0) {
	     return "关闭";
	   } else if (row.serviceStatus === 1) {
	     return "正常";
	   } else {
	     return '';
	   }
	 }

测试,成功!

总结

数据库中该字段的类型如果为int, 实体类中和前端页面都必须为数值类型. 类型要统一.