1.css样式，设置焦点失去和单位切换得方法，且单位联动，单位得v-model绑定得要是一样得就行，方便后面做联动
//输入，并且可以切换单位<el-form-item class="formCss flexStyle"><div style="width:100px; line-height: 1;">{{ $t('message.designflowrate') }}</div><div><el-input @blur="flowrateinputBlur('设计')" v-model="flowrateObj.design" style="width: 240px" /><el-select @change="flowrateinputBlur('设计')" v-model="selectionCalculationForm.designUnit" placeholder="Select" style="width: 240px"><el-option v-for="(item,index) in flowrateUnit" :key="index" :label="item" :value="item"></el-option></el-select></div></el-form-item><el-form-item class="formCss flexStyle"><div style="width:100px;">{{ $t('message.maxfowrate') }}</div><div><el-input @blur="flowrateinputBlur('最大')" v-model="flowrateObj.maximum" style="width: 240px" /><el-select @change="flowrateinputBlur('最大')" v-model="selectionCalculationForm.designUnit" placeholder="Select" style="width: 240px"><el-option v-for="(item,index) in flowrateUnit" :key="index" :label="item" :value="item"></el-option></el-select></div></el-form-item><el-form-item class="formCss flexStyle"><div style="width:100px; line-height: 1;">{{ $t('message.operationflowrate') }}</div><div><el-input @blur="flowrateinputBlur('操作')" v-model="flowrateObj.operating" style="width: 240px" /><el-select @change="flowrateinputBlur('操作')" v-model="selectionCalculationForm.designUnit" placeholder="Select" style="width: 240px"><el-option v-for="(item,index) in flowrateUnit" :key="index" :label="item" :value="item"></el-option></el-select></div></el-form-item><el-form-item class="formCss flexStyle"><div style="width:100px;">{{ $t('message.minflowrate') }}</div><div><el-input @blur="flowrateinputBlur('最小')" v-model="flowrateObj.minimum" style="width: 240px" /><el-select @change="flowrateinputBlur('最小')" v-model="selectionCalculationForm.designUnit" placeholder="Select" style="width: 240px"><el-option v-for="(item,index) in flowrateUnit" :key="index" :label="item" :value="item"></el-option></el-select></div></el-form-item>//用于展示单位换算后得数据<el-form-item class="formCss" flexStyle><div style="width:100px; line-height: 1;">{{ $t('message.designflowrate') }}</div><div><el-input disabled v-model="countToFixedObj.design" style="width: 240px" /><el-input disabled value='kg/hr' style="width: 110px;color:black" /></div></el-form-item><el-form-item class="formCss" flexStyle><div style="width:100px;">{{ $t('message.maxfowrate') }}</div><div><el-input disabled v-model="countToFixedObj.maximum" style="width: 240px" /><el-input disabled value='kg/hr' style="width: 110px" /></div></el-form-item><el-form-item class="formCss" flexStyle><div style="width:100px; line-height: 1;">{{ $t('message.operationflowrate') }}</div><div><el-input disabled v-model="countToFixedObj.operating" style="width: 240px" /><el-input disabled value='kg/hr' style="width: 110px" /></div></el-form-item><el-form-item class="formCss" flexStyle><div style="width:100px;">{{ $t('message.minflowrate') }}</div><div><el-input disabled v-model="countToFixedObj.minimum" style="width: 240px" /><el-input disabled value='kg/hr' style="width: 110px" /></div></el-form-item>
2.方法，切换单位后转换值，使用switch对所有需要的单位匹配
private flowrateinputDesign() {let flowratemin_kg_hr = nulllet flowratemin_m3_hr = nulllet flowratemin_m3_s = nullthis.numDesin = []flowratemin_kg_hr = nullflowratemin_m3_hr = nullflowratemin_m3_s = nullswitch (this.selectionCalculationForm.designUnit) {case 'g/s':flowratemin_kg_hr = this.flowrateObj.design * 3.6flowratemin_m3_hr = this.flowrateObj.design * 0.0040770102flowratemin_m3_s = this.flowrateObj.design * 0.0000013this.numDesin.push({kg_hr: flowratemin_kg_hr,m3_hr: flowratemin_m3_hr,m3_s: flowratemin_m3_s})this.countObj.design = this.numDesin[0].m3_sthis.countToFixedObj.design = this.numDesin[0].kg_hr.toFixed(3)returncase 'g/hr':flowratemin_kg_hr = this.flowrateObj.design * 0.001flowratemin_m3_hr = this.flowrateObj.design * 0.0000011325flowratemin_m3_s = this.flowrateObj.design * 0.000000000315this.numDesin.push({kg_hr: flowratemin_kg_hr,m3_hr: flowratemin_m3_hr,m3_s: flowratemin_m3_s})this.countObj.design = this.numDesin[0].m3_sthis.countToFixedObj.design = this.numDesin[0].kg_hr.toFixed(3)returndefault:}}
3.单位联动
private flowrateinputBlur(text) {
//调用 单位换算得方法，实现单位切换后，右边得数值跟着换算this.flowrateinputDesign()if (text == '最大') {this.flowrateinputMax()} else if (text == '最小') {this.flowrateinputMin()} else if (text == '操作') {this.flowrateinputOperating()} else if (text == '设计') {this.flowrateinputDesign()}
}
