FormattedUnit

February 21, 2020 ยท View on GitHub

Formats a unit based on the locale and options.

Usage

import { FormattedUnit } from 'react-native-globalize';

const ExampleComponent = () => (
  <FormattedUnit
    unit="mile-per-hour"
    value={50}
  />
);
// 50 miles per hour

const ExampleComponent2 = () => (
  <FormattedUnit
    unit="kilometer-per-hour"
    value={50}
  />
);
// 50 kilometers per hour

Props

form

TypeRequiredDefaultDescription
stringNononeUse alternate display format. Possible values: short, narrow.
<FormattedUnit
  unit="mile-per-hour"
  value={50}
  form="short"
/>
// 50 mph

numberFormatter

TypeRequiredDefaultDescription
functionNogetNumberFormatter()Customize the number formatting function.
const { getNumberFormatter } = useGlobalize();

<FormattedUnit
  unit="gigabyte"
  value={5000}
  numberFormatter={getNumberFormatter({
    minimumFractionDigits: 2,
    useGrouping: false,
  })}
/>
// 5000.00 gigabytes

unit

TypeRequiredDefaultDescription
stringYesnoneUnit to use (see note below).

The unit argument can be a unit of time (e.g. second, day, etc.), a unit of measurement (e.g. mile, meter, gigabyte), or a compound unit (e.g. mile-per-hour, kilowatt-hour).

value

TypeRequiredDefaultDescription
numberYesnoneNumber to be formatted.