He creado aplicaciones web utilizando Nuxt.js. Estoy tratando de solicitar una validación que excluya los valores negativos y los puntos decimales de todas las etiquetas de entrada (20 ~ 30) en el mismo componente vue. Creo que la forma de inyectar las reglas de validación en la etiqueta de entrada en los eventos montados en el ciclo de vida de vue va a ser exitosa, pero nada cambia la etiqueta de entrada.
<template>・・・・・・・<input type="number" style="width: 100%; box-sizing: border-box; text-align: right" v-model="item" />・・・・・・・</template> <script lang="ts"> import { Component, Vue } from 'nuxt-property-decorator' @Component({}) export default class extends Vue { onNumbers = (val: any) => { return val.replace(/\D/g, '') } mounted() { document.querySelectorAll('input').forEach((item) => { item.addEventListener('input', (val) => { this.onNumbers(val) }) }) } } </script>¿Alguien me aconseja?
En su etiqueta input , establezca las siguientes propiedades en min="0" y step="1" y debería funcionar.
<input type="number" min="0" step="1" style="width: 100%; box-sizing: border-box; text-align: right" v-model="item" />