Formatters
Bruk formatterere når du ønsker å vise et tall med et spesifikt format; for eksempel et telefonnummer, et personnummer, eller et beløp.
- Fødselsnummer
- 010651 00203
- Kortnummer
- 5457 6238 9823 4113
- Kontonummer
- 4444 11 55546
- 4444.11.55546
- Telefonnummer
- 986 51 731
- 22 43 86 34
- 815 49 300
- +47 986 51 731
- +47 22 43 86 34
- +47 815 49 300
- Avstand
- 12 000 km
- 8 000 km per år
- 9,81 m/s
- Valuta
- 127,50 kr
- 5 000 kr per måned
- kr 859,00
- Generelle tall
- 123
- 12 345
- 1 234 567
- 12 345,67
Formatterere fungerer bra alle steder der du vil vise tallinformasjon på en måte som er enklere å lese for brukeren. Det kan være i løpende tekst, tabeller, lister, eller liknende. Ved å bruke formatererene fra Jøkul sikrer du at tallinformasjon representeres likt på tvers av løsningene våre. Det skaper gjenkjennelighet for brukeren!
Maskering av skjemafelter
Noen av formatererne kan også med fordel brukes til maskering av skjemafelter. Det kan gjøre det lettere for brukeren å se at de har skrevet inn lange verdier (som kort- og kontonummer) riktig.
For å gjøre implementeringen av dette enklere tilbyr jkl-formatters-util
hjelpefunksjoner for react-hook-form
(kun for v7 eller nyere) som setter maske på feltet for deg:
Hjelpefunksjonene brukes på samme måte som register
fra react-hook-form
, men du må sende inn form
-objektet fra useForm
som første argument. Det legges ikke til validering, så om du ønsker dette må du legge det inn selv. Bruk gjerne validatorene i Jøkul!
React API
Her finner du en oversikt over props på komponentene i pakken.