React Reference > Fab Component

<Fab />

使い方 

<SpeedDial disabled={false} direction='right' onClick={() => console.log('test1')} position='left bottom'>
     <Fab>
       <Icon icon='fa-twitter' size={26} fixedWidth={false} style={{verticalAlign: 'middle'}} />
     </Fab>
     <SpeedDialItem onClick={() => console.log('speed A')}> A </SpeedDialItem>
     <SpeedDialItem onClick={() => console.log('speed B')}> B </SpeedDialItem>
     <SpeedDialItem onClick={() => console.log('speed C')}> C </SpeedDialItem>
     <SpeedDialItem onClick={() => console.log('speed D')}> D </SpeedDialItem>
   </SpeedDial>

Prop一覧

[編集]
名前 型 / デフォルト値 概要
modifier string The appearance of the button. （翻訳中） Optional.
ripple bool If true, the button will have a ripple effect when tapped. （翻訳中） Optional.
position string The position of the button. Should be a string like "bottom right" or "top left". If this attribute is not defined it will be displayed as an inline element. （翻訳中） Optional.
disabled bool If true, the button will be disabled. （翻訳中） Optional.
onClick func This function will be called ones the button is clicked. （翻訳中） Optional.

プリセットのmodifier

[編集]
Name 概要
mini Makes the ons-fab smaller. （翻訳中）

お困りですか?

Onsen UIに関する質問は、Stack Overflowにてonsen-uiタグを付与してください。Onsen UIチームはあなたの問題解決をお手伝いします。

バグ報告や機能要望については、GitHub Issuesに記載をお願いいたします。

あわせて、下記の情報も参考にしてください。