Search

Режим работы

Компонент поддерживает работу как в неконтролируемом режиме, так и контролируемом. Это стандартное поведение React-компонентов, прочитать про это можно в документации React ↗.

Для использования неконтролируемого режима достаточно просто не передавать value или передавать defaultValue, если требуется задать значение по умолчанию. Для контролируемого режима используйте связку свойств value/onChange для задания значения и его изменения.

// Неконтролируемое состояние
<Search defaultValue="Поиск" />;
 
// Контролируемое состояние
const [value, setValue] = React.useState('Поиск');
 
<Search value={value} onChange={(event) => setValue(event.target.value)} />;

Пользовательская иконка поиска

Вы можете использовать любую иконку для кнопки поиска, просто прокинув ее в свойство icon. Также, в более сложных кейсах, можно использовать функцию в свойстве icon. В качестве параметра эта функция принимает другую функцию отрисовки иконки (тип ее можно посмотреть, импортировав RenderIconButtonFn);

Кнопка “Найти”

Кнопка “Найти” отображается, если передать обработчик onFindButtonClick:

iOS-специфика

Свойство after позволяет поменять текст кнопки сброса:

Свойства и методы