useMask

useMask is used to enter input in a certain format such as numeric, date, currency, email and phone.

Usage#

import { useMask } from '@primereact/hooks';
const mask = useMask();

Examples#

Basic#

The component referenced as hooks:usemask:basic-demo is unavailable or does not exist.

Format Patterns#

Mask format can be a combination of the following definitions; a for alphabetic characters, 9 for numeric characters and * for alphanumberic characters. In addition, formatting characters like ( , ) , - are also accepted.

The component referenced as hooks:usemask:format-patterns-demo is unavailable or does not exist.

Optional#

When the input does not complete the mask definition, it is cleared by default. Use autoClear option to control this behavior. In addition, ? is used to mark anything after the question mark optional.

The component referenced as hooks:usemask:optional-demo is unavailable or does not exist.

Slot Character#

Default placeholder for a mask is underscore that can be customized using slotChar option.

The component referenced as hooks:usemask:slot-char-demo is unavailable or does not exist.