首页 > 解决方案 > Vue Js - 反向计算标准

问题描述

我有一种情况,我不得不颠倒计算标准以使其清楚:

  1. 我有可编辑的 sub_total 字段,用户可以更改它的值
  2. 首先将税前应用于此 sub_total 并给我 pre_total
  3. 其次,增值税适用于( sub_total 和 pre_total )的总和并给我vato_total
  4. 第三,将 tx 税应用于 sub_total 并给我 tx_total
  5. 最后一步是总计,即 sub_total + pre_total + vato_total + tx_total 的总和。

这是上述步骤的演示代码:

let subtotal_with_ewa = Number((this.subtotal_price / 100) * this.unit.reservation.prices.ewa_parentage) + Number(this.subtotal_price);
            this.total_ewa = parseFloat((this.subtotal_price / 100) * this.unit.reservation.prices.ewa_parentage).toFixed(2)
            this.total_vat = parseFloat((subtotal_with_ewa / 100 ) * this.unit.reservation.prices.vat_parentage).toFixed(2);
            this.total_ttx = parseFloat((this.subtotal_price / 100) * this.unit.reservation.prices.tourism_percentage).toFixed(2);
            this.total_price = parseFloat(subtotal_with_ewa + Number(this.total_vat) + Number(this.total_tourism)).toFixed(2);
            this.unit.reservation.prices.total_price_raw = parseFloat(subtotal_with_ewa + Number(this.total_vat) + Number(this.total_ttx) ).toFixed(2);
            this.unit.reservation.prices.total_price = this.unit.reservation.prices.total_price_raw ;
            this.total_price = this.unit.reservation.prices.total_price ;
            this.unit.reservation.prices.price = this.subtotal_price

它和下面的屏幕截图一样完美
在此处输入图像描述

现在的问题是:我该怎么做才能使整个操作反向我的意思是如果我改变了总价值我需要重新计算这些值直到再次获得 sub_total 之前我必须做什么......有什么想法吗?

标签: javascriptvue.js

解决方案


您需要创建计算属性,只要依赖关系发生更改,它们就会重新计算,例如:

subtotal_with_ewa(){
     return Number((this.subtotal_price / 100) * 
     this.unit.reservation.prices.ewa_parentage) + Number(this.subtotal_price);
    }

您可以使用带有计算属性的 getter 和 setter,或者将它们与字段上绑定的 v-model 分开。


推荐阅读