アイコン React コンポーネント

Icon React コンポーネントは、アイコン要素を表します。カスタムアイコン、Framework7 アイコン、およびマテリアルアイコンで使用できます。

アイコンコンポーネント

以下のコンポーネントが含まれています。

アイコン

アイコンのプロパティ

プロパティ	型	デフォルト	説明
size	数値文字列		px単位のアイコンサイズ
icon	文字列		カスタムアイコンクラス
f7	文字列		F7 アイコンフォントアイコンの名前
material	文字列		マテリアルアイコンフォントアイコンの名前
ios	文字列		iOSテーマを使用する場合に使用されるアイコン。アイコンファミリーとアイコン名をコロンで区切ったもの、例：`f7:house`
md	文字列		マテリアルテーマを使用する場合に使用されるアイコン。アイコンファミリーとアイコン名をコロンで区切ったもの、例：`material:home`
tooltip	文字列		アイコンのツールチップテキストをアイコンのホバー/押下時に表示します。
tooltipTrigger	文字列	hover	ツールチップのトリガー（表示）方法を定義します。`hover`、`click`、または`manual`になります。

例

{/*  Default back icon */}
<Icon icon="icon-back"></Icon>

{/*  Some custom icon */}
<Icon icon="icon-home"></Icon>

{/*  F7 Icons font icon */}
<Icon f7="house"></Icon>

{/*  Material Icons font icon */}
<Icon material="home"></Icon>

{/*  F7 icons font icon with custom size and color */}
<Icon f7="house" size="44px" color="blue"></Icon>

{/*  Conditional icon */}
<Icon ios="f7:house" md="material:home"></Icon>

このドキュメントを改善する

このページについて

アイコンコンポーネント
アイコンのプロパティ
例