Как сделать правильное realtime округление js+vue
У меня есть <input> у которого v-model привязан к Price когда я ввожу значения мне надо что бы он округлял все числа кратно 1000
для калькулятора цен в реальном времени
например
15699 = 1600011111= 11000
сделал watch для отслеживания Price
но в методе Priceround() не дает ввести значение больше чем кратное 1000
например при попытке 15000 = он сразу делает 2000 т.к 1500 сразу округляются до 2000
попытался сделать тайм аут 3 секунды что бы юзер мог ввести значения до округления но
setTimeout в Priceround() вызывает бесконечный спам
Как правильно реализовать real time округление или просто округление без подтверждения или нажатия кнопки submit
``` <template>
<input
v-model.number="Price"
type="number"
min="1000"
max="30000"
step="1000"
class="form-control min-vw-25% vw-25%"
required
minlength="4"
/>
</template>```
name: "calc3",
data: () => ({
Price: 1000, // базовое значение цены
day: 1, // базовое значение дня
Percent: 0, // итоговое значение процента
PercentDay: 1, // процент в день
year: 365,
// TODO: сделать проверку на високосный год
a: 100, // ячейка для деления на 100
allsum: 0,
// date: new Date().toLocaleDateString(),
// ползунок денег
stepPrice: 1,
value: 0,
maxPrice: 30000,
minPrice: 1000,
showTooltipPrice: "always",
// ползунок денег
// ползунок дня
maxday: 30,
minday: 1,
stepday: 0,
showTooltipday: "always", //always|focus|drag.
},
}),
props: {},
methods: {
Priceround() {
if (this.Price > 1000) {
console.log(`${this.Price} >`)
this.Price = Math.round(this.Price / 1000) * 1000
return this.Price
}
else if (this.Price < 1000) {
console.log(` < ${this.Price} `)
setTimeout(() => {
// alert("<1000")
this.Price = Math.round(this.Price * 1000) / 1000
}, 3000)
// this.Price = Math.round(this.Price / 1000) * 1000
return this.Price
}
},
},
computed: {},
watch: {
Price() {
// {
// if (this.price < 1000) setTimeout(this.Priceround(), 3000)
// else if (this.price > 1000) {
// this.Priceround()
// }
// }
// if (this.Price > 1000) {
// this.Priceround()
// }
this.Priceround()
if (this.Price == undefined) {
// проверка на пустую строку
return (this.Price = null)
}
// if (this.Price == isNaN) {
// // проверка на пустую строку
// return (this.Price = 1000)
// }
if (this.Price == 0) {
return (this.Price = null)
}
if (this.Price > 30000) {
return (this.Price = 30000)
// return this.getPrice()
}
if (this.Price == 30000) {
return (this.Price = 30000)
}
},
</script>