Vue.js 表单计算属性获取不到值:应纳税所得额计算的解决方案
Vue.js 表单计算属性获取不到值:应纳税所得额计算的解决方案
根据提供的代码,主要问题可能是表单中的数据没有正确绑定到form对象上,导致计算属性acTaxableincome没有正确的数据来源。以下是可能的解决方法:
-
确保表单中的输入字段(例如
input、select等)正确绑定到form对象的属性上。例如,使用v-model指令将输入字段与form对象中的相应属性绑定起来。 -
确保
form对象在组件的data选项中正确初始化,并且所有相关的属性都被正确定义。 -
确保在计算属性中引用的所有属性都在
form对象中正确定义。 -
检查是否存在其他相关的代码错误或逻辑错误,可能会影响到表单数据的获取和计算。
如果上述解决方法仍然不能解决问题,请提供更多详细的代码和错误信息,以便我可以更好地帮助您解决问题。
示例代码:
<template>
<div>
<el-form :model="form" ref="form">
<el-form-item
label="一次性补偿收入:"
prop="disposableCompensationIncome"
style="width: 290px"
>
<el-input v-model="form.disposableCompensationIncome"></el-input>
</el-form-item>
<!-- 其他表单项 -->
<el-form-item
label="应纳税额:"
prop="acTaxPiPersonCalculationSchedule.acTaxableAmount"
style="width: 290px"
>
{{ acTaxableincome }}
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
data() {
return {
form: {
// 准予扣除的捐赠额
deductionAllowedDonate: 0,
// 一次性补偿收入
disposableCompensationIncome: 0,
// 年均减除费用
averageAnnualDeductionCost: 0,
// 分均年度数
shareYearDegree: null,
// 减除费用
deductCost: null,
companyId: null,
personId: null,
reportingPeriodDate: null,
other: null,
taxExemptIncome: 0,
// 备注
remark: null,
// 小计
subtotal: 0,
// 减免税额
reductionTaxAmount: 0,
// companyId: null,
// incomeReportingCode: null,
// 所得期间起
incomePeriodDateStart: null,
// 所得期间至
incomePeriodDateEnd: null,
// 应纳税额
acTaxPiPersonVo: {
// 人员id
personId: null,
// 姓名
name: "",
// 证件号码
identificationNum: "",
// 证件类型
identificationType: "",
// 工号
employeeId: "",
// 其他
},
acTaxPiPersonCalculationSchedule: {
// 应纳税额
acTaxableAmount: 0,
// 减免税额
acTaxSavings: 0,
// 应纳税所得额
acTaxableIncome: 0,
// 已预缴税额
prepaidTaxAmount: 0,
// 税率/预扣率
taxRate: 0,
// 速算扣除数
quickCalculationDeduction: 0,
// 应补(退)税额
payableTaxAmount: 0,
// 累计应扣缴税额
acDeductiblePaymentAmount: 0,
// 年均应纳税所得额(提前退休一次性补贴表)
annualTaxableIncome: 0,
},
},
};
},
computed: {
acTaxableincome() {
const {
disposableCompensationIncome,
taxExemptIncome,
subtotal,
deductionAllowedDonate,
} = this.form;
const taxableAmount =
disposableCompensationIncome -
taxExemptIncome -
subtotal -
deductionAllowedDonate;
return taxableAmount >= 0 ? taxableAmount : 0.0;
},
},
};
</script>
注意:
- 以上代码示例中,
v-model指令将input字段与form.disposableCompensationIncome属性绑定,确保表单数据能够正确地更新到form对象中。 - 确保所有相关的属性都在
form对象中正确定义,并且在计算属性中正确引用。 - 仔细检查代码中的其他逻辑,确保没有错误或遗漏。
希望以上内容能帮助您解决问题,如果您还有其他问题,请随时提问。
原文地址: https://www.cveoy.top/t/topic/padT 著作权归作者所有。请勿转载和采集!