web-dev-qa-db-ja.com

Vuetify v-text-field change value

入力値を操作する方法ショーヒアは例です

`https://jsfiddle.net/mbqjp4ax/`

5より大きい数の場合は、9を入力する必要があります。 5つ以上入力すると問題なく動作しますが、入力し続けると期待どおりに動作しません。

vue.jsvuetify.js
2
Vin

GetElementsByTagNameなどをVueで使用する必要はありません。また、$ refsの使用にも制限があります。 v-modelを使用する必要があります。

ここであなたのフィドルは修正されました

https://jsfiddle.net/pm9zwesr/

<v-text-field
    label="Price"
    v-model="price"
    @input="up">
</v-text-field>

new Vue({
  el: '#app',
  data () {
    return {
      price: 123.45
    }
  },
  methods: {
    up (){
      if (parseFloat(this.price) > 5) {
        this.$nextTick(() => {
          this.price = 9
        })        
      }
    },

    reset () {
      this.price = 0
    }
  }
})
8
Aldarund