Limit maxlength in vue.js

The maxlength attribute only applies to text boxes that store strings, not numbers. You have some options, now I can think of two ways: using a validation library and using a handler for the event input .

With a library like vee-validate it's pretty simple:

Vue.use(VeeValidate);

new Vue({
  data: () => ({
    numero: null,
  })
}).$mount('#app');

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.6/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vee-validate/2.0.0-beta.25/vee-validate.min.js"></script>

<div id="app">
  <input 
    class="input" 
    type="number" 
    v-model.number="numero"
    name="numero"
    v-validate="'required|numeric|max:10'"
  />
  <span v-show="errors.has('numero')">
    {{ errors.first('numero') }}
  </span>
</div>

Try doing something like this:

Use the V-Validator.

O Asi:

<input type="text" name="numero" v-model.number="numero" v-validate:numero="{required: true, maxlength: 15}"/>

Taken from:

https://blog.midkemia.fr/form-validation-with-vue-js/

It should be noted that I put maxlength by inertia. checking the documentation of vue.js in no place it appeared: maxlength , only minlegth

Thanks for your answers, but solve it in the following way:

<input class="input" onKeyUp="if(this.value>9){this.value='9';}else if(this.value<0){this.value='0';}" v-model.number="numero" type="number">

I'll leave it in case someone gets to occupy it.