Password

Cập nhật lần cuối: 16/04/2025

import { Input } from "zmp-ui";
const { Password } = Input;

Dùng để nhập mật khẩu

Ví dụ

Bảng thuộc tính

InputProps

Name	Type	Default	Description
size	InputSize	'medium'	Kích thước của input. Mang một trong các giá trị small, medium hoặc large.
status	InputStatus		Trạng thái hợp lệ của input. Nếu là error, input sẽ có màu cảnh báo kèm theo errorText, ngược lại input sẽ có màu trung hoà kèm theo helperText.
type	InputType		Loại input.
value	InputHTMLAttributes['value']		Giá trị của input. Cần được sử dụng cùng với onChange để cập nhật lại giá trị.
onChange	InputHTMLAttributes['onChange']		Callback được gọi khi giá trị của input thay đổi. Cần phải cập nhật lại giá trị của value nếu được truyền vào.
onPressEnter	KeyboardEventHandler		Callback được gọi khi người dùng nhấn Enter hoặc xuống dòng trong input.

PasswordProps

Name	Type	Default	Description
iconRender	(visible: boolean) => React.ReactNode		Custom icon để hiển thị trên Visibility Toggle thay cho icon mặc định. Cần được sử dụng cùng với visibilityToggle. Giá trị được truyền vào dưới dạng một function, với tham số đầu tiên là một biến boolean thể hiện trạng thái hiển thị hoặc bị che của mật khẩu và trả về một ReactNode.
visibilityToggle	boolean	false	Khi được bật, một biểu tượng hình con mắt (Visibility Toggle) sẽ được hiển thị ở bên phải input để cho phép người dùng hiển thị hoặc che đi mật khẩu họ đã nhập khi nhấn vào.