前言

唉，最近又干了一件非常蠢的事！由于一个函数的圈复杂度过高，过不了门禁，又着急上线。我改半天无果，只得求助导师，结果可想而知。导师在会议那头唾沫横飞，我都不敢吱声了，此处手动撞墙...... 需求如下：

一、来一个简约的页面布局

<template>
  <div>
    <el-form ref="form" :rules="rules" :model="params" label-width="80px">
      <el-form-item label="预估分数1" prop="score1">
        <el-input :span="5" v-model="params.score1" style="width:120px"></el-input>
      </el-form-item>
      <el-form-item label="预估分数2" prop="score2" >
        <el-input v-model="params.score2" style="width:120px"></el-input>
      </el-form-item>
      <el-form-item label="预估分数3" prop="score3">
        <el-input v-model="params.score3" style="width:120px"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button @click="calculate()">计算</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
export default {
  data() {
    return {
      params: {
        score1:'',
        score2:'',
        score3:''
      },
      rules: {}
    }
  },
  methods: {
    calculate(){}
  }
}
</script>

二、校验处理

  methods: {
    calculate(){
      // ◆校验准备
      const _ = this.params
      const validateArr = [_.score1, _.score2, _.score3]
      const isNull = validateArr.find(item=>Number(item) > 0)
      // ◆非空校验
      if(!isNull){
        this.$message.error('评估分数不能为空！')
      }
      // ◆逐级增大校验
      validateArr.reduce((curr, next)=>{
        if(Number(next) && Number(next) <= Number(curr)){
          this.$message.error('评估分数必须逐级递增！')
        }
        return next
      }, 0)
    }
  }