Réservez zéro comme premier caractère de l'entrée HTML

Question

J'ai donc un problème avec la saisie HTML dans Vue. Chaque fois que j'essaie d'entrer avec zéro comme premier caractère, la valeur d'entrée change. Par exemple, si je veux saisir « 005 », cela deviendra « 5 », et de même pour « 05 », cela deviendra « 5 ». J'ai essayé de rechercher des informations à ce sujet, mais tout ce que j'ai trouvé, c'est comment le mettre en œuvre, pas comment l'empêcher. Des idées?

J'ai essayé d'utiliser e.preventDefauld(), mais e n'est pas défini. J'ai également essayé de convertir le nombre en chaîne lors de l'entrée.

Answer 1

Ce qui suit devrait fonctionner comme prévu

<template>
  number: {{ number }}
  <input :value="number" @input="updateNumber" type="number">
</template>

<script>
export default {
  data() {
    return {
      number: 12
    }
  },
  methods: {
    updateNumber(e) {
      this.number = e.target.value
    }
  }
}
</script>

C'est un terrain de jeu.