10 進数の追跡中に入力が変更された場合、html-Input-value をドイツ語形式の数値として表示します

Question

したがって、ドイツの 10 進数では 10 進カンマが使用されます。書式設定するときは、数値をグループ化するためにピリオドも使用します。したがって、数値 10000.45 は 10.000,45 としてフォーマットされます。

次に、ピリオドとカンマを使用して「ドイツ語」の方法で入力できる入力フィールド (数値またはテキスト) が必要です。ただし、JavaScript で「通常の」値も追跡したいと考えています。

次のコマンドを使用して、数値をドイツ語形式の値に簡単に変換します

リーリー

しかし、それを 10 進数に戻すにはどうすればよいでしょうか? 「7,20」のようなドイツ語形式で値を表示するときは、最後に追加しますよね？

これは、以下に示すように、svelte-repl の予備的な試みです。 https://svelte.dev/repl/fabd0a80f4ee49509cd875c0175bcf22?version=4.0.1

リーリー

理想的には、入力イベントに書式設定された値を表示したいと考えています。ただし、変更中のイベントにも表示される場合があります。または、側面のボタンなどを使用することもできます。 ヒントをいただければ幸いです。 :)

Answer 1

ユーザー入力をいじらないこと、つまり input イベント ハンドラーで formattedValue を設定しないことをお勧めします。数値を適切にフォーマットしたい場合は、コンポーネントが最初に表示されるときにこれを実行し、ユーザーの意図を妨げないように Blur で実行します。

ユーザーが入力するときに特定の形式を強制したい場合、カーソルの位置、シャープ記号、クリア値、その他の要素を考慮する必要があるため、それは簡単ではありません。 imask など、これを実現できるライブラリもあります。