Search

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

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

Dùng để nhập nội dung tìm kiếm

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.

SearchProps

Name	Type	Default	Description
loading	boolean	false	Trạng thái loading của input. Khi được bật, input sẽ hiển thị một biểu tượng loading ở đầu input thay cho biểu tượng kính lúp (Search Icon).
onSearch	(value: string, event: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent) => void		Callback được gọi khi người dùng tiến hành tìm kiếm. Các hành động được xem là tiến hành tìm kiếm bao gồm: Nhấn vào biểu tượng kính lúp (Search Icon) Nhấn Enter/Return hoặc xuống dòng trong input