как ввести точку «.» в поле ввода цены вручную

#vue.js

Вопрос:

Здесь я написал vue.js наблюдатель. Где, если пользователь вводит номер в поле ввода цены после ввода определенного номера, запятая», » будет динамически запрашиваться с помощью наблюдателя. Поэтому здесь я не могу ввести точку «.» вручную я хочу ввести «.» в этом поле цены, как мы можем это сделать.

 <input type="text" placeholder="Price" v-model="price" name="price">
 
 watch: {
    price: function(newValue) {
      const result = newValue.replace(/D/g, "")
        .replace(/B(?=(d{3}) (?!d))/g, ",");
      Vue.nextTick(() => this.price = result);
    }
  },
 

Ответ №1:

Я предлагаю использовать lazy модификатор в v-model директиве :

 new Vue({
  el: '#app',

  data() {
    return {price:''}
  },
  watch: {
    price: function(newValue) {
      const result = newValue.replace(/D/g, "")
        .replace(/B(?=(d{3}) (?!d))/g, ",");
      Vue.nextTick(() => this.price = result);
    }
  },
  }) 
 <link type="text/css" rel="stylesheet" href="//unpkg.com/bootstrap/dist/css/bootstrap.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>


<div id="app" class="container">

<input type="text" placeholder="Price" v-model.lazy="price" name="price"/>
</div> 

Комментарии:

1. Спасибо, что он работает, и я могу ввести точку».». но существующий наблюдатель кода тогда не работает.

2. модификатор lazy запускает наблюдатель, когда вы оставляете ввод