web-dev-qa-db-ja.com

ReactネイティブEXPOを使用する場合、どのように数値を通貨にフォーマットしますか？

_10000_のような数値を取得して_$10,000.00_として出力するにはどうすればよいですか？

_Not a function_エラーでString.format(...)に問題がありました。

私は多数の記事をフォローしましたが、すべてが不完全で、どれも機能していません。

完全な国際化は必要ありません。数値をフォーマットする機能だけです。

react-nativeexpo
15
Choco

このライブラリ react-number-format を使用できます。これらの機能があります

  1. 接頭辞、接尾辞、桁区切り記号。
  2. カスタムフォーマットパターン。
  3. マスキング。
  4. カスタムフォーマットハンドラ。
  5. 入力の数値をフォーマットするか、単純なテキストとしてフォーマットする

使用例

<NumberFormat value={2456981} displayType={'text'} thousandSeparator={true} prefix={'$'} />

出力：$ 2,456,981

10
Masuk Helal Anik

toFixedメソッドを使用して、小数点以下2桁を表示できます。

let num = 1000; 
console.log(num.toFixed(2)); // 1000.00

そして、あなたはこのように正規表現を使うことができます

function currencyFormat(num) {
   return '$' + num.toFixed(2).replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,')
}
console.log(currencyFormat(2665)); // $2,665.00
11
Robin

上記のどれも私にとってうまくいきませんでした...しかし、このチャップは正しいアイデア/解決策を持っていました https://medium.com/@nidhinkumar/react-js-number-format-and-styling-a1a6e211e629

const numberFormat = (value) =>
  new Intl.NumberFormat('en-IN', {
    style: 'currency',
    currency: 'INR'
  }).format(value);

numberFormat(50000); //output as ₹ 50,000.00
numberFormat(10000); //output as ₹ 10,000.00
1
Murray