フォーム検証ルール内のすべての行の検証価格比率の合計は 1 です (精度損失の問題)

 通常検証の効果は以下の通り（改造コード）

 

ブロガーは小さな問題に遭遇しましたが、将来さらなる落とし穴を避けるためにそれを記録できると考えていましたが、合計がすでに 1 になっていたとき、私は非常に混乱しました。

写真のように、価格比率列で全行の合計が1となる行をチェックする小さな関数を作りました。

 

検証ルールのコードは次のとおりです

computed に書かれているのは、入力時にリアルタイムで検証ルールの更新をトリガーして、それが正しいかどうかを検証することです。

  computed: {
    rules() {
      var testValid = (rule, value, callback) => {
        if (value <= 0) {
          return callback(new Error('不能填写小于等于0的数据'))
        }
        let flag = false
        let countArr = []
        if (this.list && this.list.length > 0) {
          this.list.forEach((item) => {
            if (item.priceRatio) {
              countArr.push(item.priceRatio)
            }
          })
        }

        const sum = (num) => {
          let i = 0,
            result = 0
          while (i < num.length) {
            result += Number(num[i])
            i++
          }
          return result
        }
        const sumlength = (num) => {
          let i = 0

          while (i < num.length) {
            i++
          }
          return i
        }
        let count = sum(countArr)
        let currentLength = sumlength(countArr)
        console.log('currentLength', currentLength)
        console.log('count', count)
        if ((count != 1 && currentLength == this.list.length) || count > 1) {
          flag = true
        }
        if (flag) {
          callback(new Error('价格比例相加不等于1'))
        } else {
          this.$refs['tabs'].clearTableValidate()
          callback()
        }
      }
      return {
        // 主表表单校验规则
        goodsCode: [
          { required: true, message: '此项为必填项', trigger: 'blur' },
        ],
        priceRatio: [
          {
            required: this.isRequired,
            message: '此项为必填项',
            trigger: ['blur', 'change'],
          },
          {
            validator: this.isRequired ? testValid : '',
            trigger: ['blur', 'change'],
          },
        ],
        giftQuantity: [
          { required: false, trigger: 'blur' },
          {
            pattern: /^([1-9][0-9]*)$/,
            message: '请输入正整数',
            trigger: 'blur',
          },
        ],
        quantity: [
          { required: true, message: '此项为必填项', trigger: 'blur' },
          {
            pattern: /^(0|\+?[1-9][0-9]{0,4})$/,
            message: '请输入不超过五位数的正整数',
            trigger: 'blur',
          },
        ],
      }
    },

このため、対応する加算データを印刷してみたところ、加算値が0.99999となっており、精度が落ちていることに気づき、修正するだけで済みました。

 

 const sum = (num) => {
          let i = 0,
            result = 0
          while (i < num.length) {
            result += Number(num[i])
            i++
          }
          return Number(result.toFixed(2)) // 将结果四舍五入到2位小数  解决精度丢失问题
}

ついにこの小さな問題を解決できます