<el-progress :percentage="computedPercentage(scope.row) >= 100 ? 100 : computedPercentage(scope.row)" :format="computedPercentage(scope.row, 1)"></el-progress>
computedPercentage(row, format){
      if(!row.yearComplete || !row.yearTarget){
        if(format){
          return () => {
            return 0 + '%'
          }
        }else{
          return 0
        }
      }
      else{
        if(format){
          return () =>{
            return Number((row.yearComplete / row.yearTarget * 100).toFixed(2)) + '%'
          }
        }else{
          return Number((row.yearComplete / row.yearTarget * 100).toFixed(2))
        }
      }
    },

需要注意以下几点:

        1、判断除数和被除数为0直接返回0 否则会报错 Expected Number with value NaN

        2、percentage 超过100 组件验证报错,通过三目运算让超过100的进度条都显示为100

        3、format 需要返回一个function 类型,所以返回套在function 里,在此function 内部返回值

Logo

前往低代码交流专区

更多推荐