fix: 修复价格输入验证并统一使用@input事件
修复价格输入验证逻辑,防止多个小数点和以小数点开头的情况 使用@input替代@onInput事件监听,确保视图及时更新
Showing
1 changed file
with
40 additions
and
22 deletions
| ... | @@ -219,7 +219,7 @@ | ... | @@ -219,7 +219,7 @@ |
| 219 | </view> | 219 | </view> |
| 220 | <view class="form-item-right"> | 220 | <view class="form-item-right"> |
| 221 | <text class="price-symbol">¥</text> | 221 | <text class="price-symbol">¥</text> |
| 222 | - <input v-model="formData.price" placeholder="请输入" type="digit" class="price-input" @onInput="validatePriceInput" /> | 222 | + <input v-model="formData.price" placeholder="请输入" type="digit" class="price-input" @input="validatePriceInput" /> |
| 223 | </view> | 223 | </view> |
| 224 | </view> | 224 | </view> |
| 225 | 225 | ||
| ... | @@ -231,7 +231,7 @@ | ... | @@ -231,7 +231,7 @@ |
| 231 | <view class="form-item-right"> | 231 | <view class="form-item-right"> |
| 232 | <text class="market-price-symbol">¥</text> | 232 | <text class="market-price-symbol">¥</text> |
| 233 | <input v-model="formData.market_price" placeholder="请输入" type="digit" | 233 | <input v-model="formData.market_price" placeholder="请输入" type="digit" |
| 234 | - class="market-price-input" @onInput="validateMarketPriceInput" /> | 234 | + class="market-price-input" @input="validateMarketPriceInput" /> |
| 235 | </view> | 235 | </view> |
| 236 | </view> | 236 | </view> |
| 237 | </view> | 237 | </view> |
| ... | @@ -609,17 +609,26 @@ const showTireWearPicker = () => { | ... | @@ -609,17 +609,26 @@ const showTireWearPicker = () => { |
| 609 | * @param {Object} event - 输入事件对象 | 609 | * @param {Object} event - 输入事件对象 |
| 610 | */ | 610 | */ |
| 611 | const validatePriceInput = (event) => { | 611 | const validatePriceInput = (event) => { |
| 612 | - const value = event.detail.value | 612 | + let value = event.detail.value |
| 613 | - const validValue = value.replace(/[^0-9.]/g, '') | 613 | + |
| 614 | - | 614 | + // 只保留数字和小数点,删除其他字符 |
| 615 | - // 防止多个小数点 | 615 | + value = value.replace(/[^0-9.]/g, '') |
| 616 | - const parts = validValue.split('.') | 616 | + |
| 617 | - if (parts.length > 2) { | 617 | + // 防止多个小数点,只保留第一个小数点 |
| 618 | - const newValue = parts[0] + '.' + parts.slice(1).join('') | 618 | + const dotIndex = value.indexOf('.') |
| 619 | - formData.price = newValue | 619 | + if (dotIndex !== -1) { |
| 620 | - } else { | 620 | + value = value.substring(0, dotIndex + 1) + value.substring(dotIndex + 1).replace(/\./g, '') |
| 621 | - formData.price = validValue | ||
| 622 | } | 621 | } |
| 622 | + | ||
| 623 | + // 防止以小数点开头 | ||
| 624 | + if (value.startsWith('.')) { | ||
| 625 | + value = '0' + value | ||
| 626 | + } | ||
| 627 | + | ||
| 628 | + // 使用 nextTick 确保视图更新 | ||
| 629 | + Taro.nextTick(() => { | ||
| 630 | + formData.price = value | ||
| 631 | + }) | ||
| 623 | } | 632 | } |
| 624 | 633 | ||
| 625 | /** | 634 | /** |
| ... | @@ -627,17 +636,26 @@ const validatePriceInput = (event) => { | ... | @@ -627,17 +636,26 @@ const validatePriceInput = (event) => { |
| 627 | * @param {Object} event - 输入事件对象 | 636 | * @param {Object} event - 输入事件对象 |
| 628 | */ | 637 | */ |
| 629 | const validateMarketPriceInput = (event) => { | 638 | const validateMarketPriceInput = (event) => { |
| 630 | - const value = event.detail.value | 639 | + let value = event.detail.value |
| 631 | - const validValue = value.replace(/[^0-9.]/g, '') | 640 | + |
| 632 | - | 641 | + // 只保留数字和小数点,删除其他字符 |
| 633 | - // 防止多个小数点 | 642 | + value = value.replace(/[^0-9.]/g, '') |
| 634 | - const parts = validValue.split('.') | 643 | + |
| 635 | - if (parts.length > 2) { | 644 | + // 防止多个小数点,只保留第一个小数点 |
| 636 | - const newValue = parts[0] + '.' + parts.slice(1).join('') | 645 | + const dotIndex = value.indexOf('.') |
| 637 | - formData.market_price = newValue | 646 | + if (dotIndex !== -1) { |
| 638 | - } else { | 647 | + value = value.substring(0, dotIndex + 1) + value.substring(dotIndex + 1).replace(/\./g, '') |
| 639 | - formData.market_price = validValue | ||
| 640 | } | 648 | } |
| 649 | + | ||
| 650 | + // 防止以小数点开头 | ||
| 651 | + if (value.startsWith('.')) { | ||
| 652 | + value = '0' + value | ||
| 653 | + } | ||
| 654 | + | ||
| 655 | + // 使用 nextTick 确保视图更新 | ||
| 656 | + Taro.nextTick(() => { | ||
| 657 | + formData.market_price = value | ||
| 658 | + }) | ||
| 641 | } | 659 | } |
| 642 | 660 | ||
| 643 | /** | 661 | /** | ... | ... |
-
Please register or login to post a comment