1
votes

comment ajouter automatiquement des virgules aux nombres saisis

J'ai une calculatrice. Comment ajouter des virgules à une entrée, de sorte que lorsque je tape 40000, il affichera automatiquement 40 000? (Le nombre doit rester à 40000 pour faire le bon calcul.)

Voici comment j'obtiens la valeur des entrées:

 handleStateChange = (e) => {
        const { target: { name, value } } = e
        this.setState({ [name]: value })
        }

reactjs

1 commentaires

Copie possible de Dans React, comment formater un nombre avec des virgules?

4 Réponses :

-1
votes

Format des nombres de réaction essayez ce package npm.

1 commentaires

Si possible, vous pouvez fournir un exemple de code sur la façon d'appliquer le package au problème d'OP pour rendre votre réponse plus utile.

0
votes

Vous pouvez essayer regex comme ci-dessous

handleStateChange = (e) => {
  const { target: { name, value } } = e
  this.setState({ [name]: value.replace(/\B(?=(\d{3})+(?!\d))/g, ",") })
}

0 commentaires

0
votes

Il existe plusieurs façons de mettre une virgule entre un entier, le plus simple est d'utiliser toLocaleString () , et vous pouvez utiliser regex pour supprimer la virgule de la chaîne,

voici un exemple.

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"><div>

class App extends React.Component {
  state = {};

  handleStateChange = e => {
    const {
      target: { name, value }
    } = e;
    
    const formatNumber = parseInt(value.replace(/,/g, '')).toLocaleString();
    this.setState({ [name]: formatNumber });
  };

  render() {
    return (
      <div>
        <input type="text" onChange={this.handleStateChange} value={this.state.foo} name="foo" />
      </div>
    );
  }
}



ReactDOM.render(<App />,document.getElementById("root"));

0 commentaires

1
votes

Cela fonctionne pour moi:

  const handleChange = (name, e) => {
    const { value } = e.targe;
    if(value) {
      const formattedValue = (Number(value.replace(/\D/g, '')) || '').toLocaleString();
      this.setState({ [name]: formattedValue });
    }
    return null;
  };

0 commentaires