react essential tools

реагируют неотъемлемые tools

Сбор основных крючков и компонентов реагирования

Живые примеры использования рассказов

Функции

• Легко учиться и использовать.
• Содержит множество полезных компонентов.
• Содержит множество передовых крючков, которые уточняются из приложения.
• Содержит множество основных крючков.
• Написано в TypeScript.

Установка

 npm i react-essential-tools

Использование

Вы должны установить React 16.8.0 или позже, чтобы использовать API Hooks. Вы можете импортировать каждый крюк или компонент, используя ES6 с именем Imports (рекомендуется встряхивание дерева).

 import { Tooltip , useAsync } from 'react-essential-tools' ;

Компоненты

Источник	Предварительный просмотр	Краткое описание
CircularProgress	Демо	Индикаторы прогресса, обычно известные как прядильщики, выражают неопределенное время ожидания или отображают длину процесса.
Modal	Демо	Обеспечивает прочную основу для создания диалогов, Popovers, Lightbox или чего -то еще.
Backdrop	Демо	Тухинный слой по вашему приложению.
Skeleton	Демо	Заполнитель для загрузки
NoSsr		Отключить SSR для содержания
Tooltip	Демо	Небольшое всплывающее окно с информацией
Popper	Демо	Отображает контент поверх другого
Collapse	Демо	Анимирует расширение/коллапс контента
Slide	Демо	Анимирует слайд-в-внедорожник контента
Zoom	Демо	Анимирует масштабирование/увеличение контента
Fade	Демо	Анимирует затухание/исчезновение контента
Grow	Демо	Анимирует масштаб/масштабирование контента
Portal	Демо	Рендеринг содержимого внутри любого целевого узла DOM

Крючки

Источник	Предварительный просмотр	Краткое описание
useDebouncedCallback	Демо	Выберите обратный вызов
useLongPress	Демо	Запускает обратный вызов после долгого нажатия
useHover	Демо	Треки паряки элемента
useHistory	Демо	Государство с отменой/повторным/сбросом
useMedia	Демо	CSS Media Query State
useMotion	Демо	Состояние датчика ускорения устройства
useClipboard	Демо	Читать и написать в буфер обмена пользователя
useMouse	Демо	Государство позиции мыши
useIntersection	Демо	Пересечение элементов Viewport State
useClickAway	Демо	Зажигает обратный вызов на внешнем щелчке
useNetwork	Демо	Сетевая информация состояние
useWindowScroll	Демо	Состояние положения свитков
useKey	Демо	Застревает обратный вызов после настроенного использования клавиш клавиатуры
useEvent	Демо	Добавить слушателей и автоматически чистка при Unmount
useTimeoutFn	Демо	Вызов обратном вызове с задержкой
useInterval	Демо	Вызов вызовов с контролируемым интервалом
usePrevious	Демо	Предыдущее значение состояния
useUpdateEffect	Демо	useEffect с первым вызовом Skip
useMount	Демо	Выстрел в обратный вызов на горе
useUnmount	Демо	Вызов обратно
useLocalStorage		Синхронизированное состояние для localstorage
useAsync	Демо	Асинхронное/обещание
useAsyncFn	Демо	Асинхро
useBoolean	Демо	Установить с логической ценой и обратным вызовом
useSetState	Демо	Установить с аналогичным слиянием компонентов класса setState слияния
useFirstMountState	Демо	Вернуть true на рендеринге первого компонента
useMountedState	Демо	Вернуть обратный вызов, чтобы проверить, установлен ли компонент
useIsomorphicLayoutEffect		useLayoutEffect , который не показывает предупреждения при рендеринге на стороне сервера

Лицензия

Этот проект лицензирован по лицензии MIT, Copyright (C) 2019 Ruslan Povolockii. Для получения дополнительной информации см. LICENSE.md .