我正在尝试格式化输入中输入的数字,当我离开输入但该值未在 v-model 中更新时,我调用一个函数来执行此操作。
该函数工作正常,因为我警告了该值,但它从未在 View 中更新。
有什么想法吗?
html
<div v-for="year in years">
<input type="text" :disabled="budget.checked[year] == true" v-on:blur="formatMoney(budget.personnelBudget[year])" v-model="budget.personnelBudget[year]"/>
<input type="text" :disabled="budget.checked[year] == true" v-on:blur="formatMoney(budget.travellingBudget[year])" v-model="budget.travellingBudget[year]" />
<input type="text" :disabled="budget.checked[year] == true" v-on:blur="formatMoney(budget.inventoriableBudget[year]" v-model="budget.inventoriableBudget[year]" />
.....
js
data: function(){
return{
budget:{
personnelBudget:[],
travellingBudget:[],
inventoriableBudget:[],
consumablesBudget:[],
indirectExpensesPercent:[],
indirectExpensesBudget:[],
totalBudget:[],
checked:[],
},
},
methods: {
formatMoney(input) {
this.budget.personnelBudget[year]=this.budget.personnelBudget[year]
.replace(/,/g, "")
this.budget.personnelBudget[year]=parseFloat(this.budget.personnelBudget[year])
.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,');
alert(this.budget.personnelBudget[year])
},
最佳答案
您遇到了 react 性问题,因为您正在为嵌套字段分配一个值,而该值未反射(reflect)在 template 中,要解决此问题,请尝试使用 this.$set
:
this.$set(this.budget,'personnelBudget',
{...this.budget.personnelBudget,
[year]:this.budget.personnelBudget[year].replace(/,/g, "")})
然后尝试将输入作为字符串传递:
<input ... v-on:blur="formatMoney('personnelBudget',year)" v-model="budget.personnelBudget[year]"/>
和
formatMoney(input,year) {
this.$set(this.budget,'personnelBudget',
{...this.budget[input],
[year]:this.budget[input][year].replace(/,/g, "")})
关于javascript - vue.js 更改值未在输入 v-model 中更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65125907/