react haiku
v2.1.8
俳句は、保存を目標とするシンプルで軽量の反応ライブラリです
フックとユーティリティの大規模なコレクションを提供することで時間
仕事をより速く、より効率的に完了させるのを手伝ってください!
俳句のインストールはとても簡単です!
React> = 16.8.0が必要です
npm install react-haikuyarn add react-haikupnpm install react-haikuこのプロジェクトでは、Jestをテストフレームワークとして使用し、ReactコンポーネントとフックをテストするためにReactテストライブラリ(RTL)を使用しています。
カバレッジを有効にしてすべてのユニットテストを実行します
npm run test 完全な使用例については、公式ドキュメントを確認してください。
import { useHover } from 'react-haiku' ;
const Component = ( ) => {
const { hovered , ref } = useHover ( ) ;
return < p ref = { ref } > { hovered ? 'All mice on me' : 'No mice on me' } </ p > ;
} ;
export default Component ; import { For } from 'react-haiku' ;
const Component = ( ) => {
const list = [ { name : 'React' } , { name : 'Haiku' } ] ;
render (
< >
< For each = { list } render = { ( item , index ) => < p > { item . name } </ p > } />
</ > ,
) ;
} ;
export default Component ; 俳句は常に改善と貢献に対して開かれています。貢献したい場合は、オープンな問題を確認できます。また、機能要求テンプレートを使用して独自の改善/アイデアを追加することもできます。貢献する前に、貢献ガイドを読んで、標準を尊重してください!お時間をいただきありがとうございます!
useClipboard() - ユーザーのクリップボードにデータをコピーします!useHover() - マウスが要素の上にあるかどうかを検出するための迅速な方法!useInputValue() - この単純なフックで入力状態を管理します!useLeaveDetection() - ユーザーのカーソルがページを離れるときに検出します!useMediaQuery() - メディアクエリを使用してコンポーネントを操作します!useMousePosition() - ターゲットまたはドキュメント全体に対するマウスの現在の位置を検出します!usePrefersTheme() - ユーザーの優先システムテーマを検出します!useScript() - コンポーネントのドキュメントにスクリプトタグを添付してください!useToggle() - 2つの異なるオプション間で状態値を切り替えます!useBoolToggle() - トグルブール状態値!useUrgentUpdate() - このフックを呼び出すときにコンポーネントを強制します!useClickOutside() - ターゲット要素の外側のクリックを検出します!useConfirmExit() - 状態が汚れていると設定されている場合は、タブを閉じる前にメッセージを使用してユーザーにプロンプトします。useDebounce() - 状態の変化をデバウンスして、遅延後に更新に反応します!useEventListener() - ウィンドウオブジェクトまたは特定のターゲット要素でイベントリスナーを設定します!useFavicon() - コンポーネントからWebサイトのFaviconを動的に更新します!useFirstRender() - コンポーネントが最初のレンダリングにあるかどうかを確認してください!useHold() - ターゲット要素でロングプレスを処理し、設定された遅延後にハンドラーを実行します!useIdle() - イベントに基づいてページでユーザーアクティビティ/非アクティブを検出します!useIsomorphicLayoutEffect() - 実行環境(SSR vsブラウザー)に応じて、useefectとuseLayouteffectの切り替え!useLocalStorage() - ローカルストレージ値を動的に管理しますuseScrollPosition() - ページ上の現在のスクロール位置にアクセスし、プログラムで変更します。useSingleEffect() - コンポーネントがマウントされたときに、使用効果フックを1回だけ実行します!useTitle() - コンポーネントからドキュメントのタイトルを更新してください!useUpdateEffect() - effectと同様ですが、コンポーネントの最初のレンダリングをスキップし、依存関係の値によってトリガーされる更新にのみ反応します。If単純な条件付きレンダリング用のコンポーネント!Show複雑な条件付きレンダリングのコンポーネント!For自動キー割り当てを使用した動的レンダリングコンポーネント!RenderAfter設定された遅延後に子供をレンダリングするコンポーネント。Image - 画像のレンダリングプロセスを簡素化するコンポーネント。 デビッド・ハズ
mit