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

Icon ReactコンポーネントはIcon要素を表します。カスタムアイコン、Framework7 Icons、Material Iconsなどですぐに利用できます。

アイコンコンポーネント

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

Icon (アイコン)

アイコンのプロパティ

Prop	Type	Default	Description
size	number string		アイコンのサイズ（px
icon	string		カスタムアイコンクラス
f7	string		F7アイコンのフォントアイコン名
material	string		マテリアルアイコンの名称フォントアイコン
ios	string		iOSテーマを使用している場合に使用されるアイコンです。アイコンファミリーとアイコン名をコロンで区切ったものです。
md	string		Materialテーマを使用した場合のアイコンです。アイコンファミリーとアイコンの名前をコロンで区切ったもので構成されます。
aurora	string		Auroraテーマの場合に使用されるアイコンです。アイコンファミリーとアイコンの名前をコロンで区切ったもので構成されます。
tooltip	string		アイコン tooltip アイコンが押されたときに表示されるテキストです。
tooltipTrigger	string	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" aurora="f7:house" md="material:home"></Icon>