ion-fab-list
的
ion-fab-list
元素是多个fab按钮的容器。此fab按钮集合包含与主fab按钮相关的操作，单击即可弹出。要指定按钮应该出现在哪一边，请设置
一边
属性为'start'， 'end'， 'top'， 'bottom'
使用
<
ion-fab
垂直
＝
＂
中心
＂
水平
＝
＂
中心
＂
>
<
ion-fab-button
>
分享
ion-fab-button
>
<
ion-fab-list
一边
＝
＂
前
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-facebook
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-twitter
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-youtube
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
<
ion-fab-list
一边
＝
＂
结束
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-pwa
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-npm
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-betway东盟体育appionic
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
<
ion-fab-list
一边
＝
＂
底
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-github
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-javascript
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-angular
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
<
ion-fab-list
一边
＝
＂
开始
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-vimeo
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-chrome
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-react
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
ion-fab
>
复制
复制
<
ion-fab
垂直
＝
＂
中心
＂
水平
＝
＂
中心
＂
>
<
ion-fab-button
>
分享
ion-fab-button
>
<
ion-fab-list
一边
＝
＂
前
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-facebook
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-twitter
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-youtube
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
<
ion-fab-list
一边
＝
＂
结束
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-pwa
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-npm
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-betway东盟体育appionic
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
<
ion-fab-list
一边
＝
＂
底
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-github
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-javascript
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-angular
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
<
ion-fab-list
一边
＝
＂
开始
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-vimeo
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-chrome
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-react
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
ion-fab
>
复制
复制
进口
反应
从
“反应”
；
进口
｛
IonFab
，
IonFabButton
，
IonFabList
，
IonContent
，
betway东盟体育appIonIcon
｝
从
“@betway东盟体育appionic /反应”
；
进口
｛
logoFacebook
，
logoTwitter
，
logoYoutube
，
logoPwa
，
logoNpm
，
logobetway东盟体育appIonic
，
logoGithub
，
logoJavascript
，
logoAngular
，
logoVimeo
，
logoChrome
，
logoReact
｝
从
“betway东盟体育appionicons /图标”
；
出口
常量
FabListExample
：
反应
．
足球俱乐部
＝
（
）
＝＞
（
<
IonContent
>
<
IonFab
垂直
＝
＂
中心
＂
水平
＝
＂
中心
＂
>
<
IonFabButton
>
分享
IonFabButton
>
<
IonFabList
一边
＝
＂
前
＂
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoFacebook
｝
/>
IonFabButton
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoTwitter
｝
/>
IonFabButton
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoYoutube
｝
/>
IonFabButton
>
IonFabList
>
<
IonFabList
一边
＝
＂
结束
＂
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoPwa
｝
/>
IonFabButton
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoNpm
｝
/>
IonFabButton
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logobetway东盟体育appIonic
｝
/>
IonFabButton
>
IonFabList
>
<
IonFabList
一边
＝
＂
底
＂
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoGithub
｝
/>
IonFabButton
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoJavascript
｝
/>
IonFabButton
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoAngular
｝
/>
IonFabButton
>
IonFabList
>
<
IonFabList
一边
＝
＂
开始
＂
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoVimeo
｝
/>
IonFabButton
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoChrome
｝
/>
IonFabButton
>
<
IonFabButton
>
<
betway东盟体育appIonIcon
图标
＝
｛
logoReact
｝
/>
IonFabButton
>
IonFabList
>
IonFab
>
IonContent
>
）
；
复制
复制
进口
｛
组件
，
h
｝
从
“@stencil /核心”
；
＠
组件
（
｛
标签
：
“fab-list-example”
，
styleUrl
：
“fab-list-example.css”
｝
）
出口
类
FabListExample
｛
渲染
（
）
｛
返回
［
<
ion-fab
垂直
＝
＂
中心
＂
水平
＝
＂
中心
＂
>
<
ion-fab-button
>
分享
ion-fab-button
>
<
ion-fab-list
一边
＝
＂
前
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-facebook
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-twitter
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-youtube
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
<
ion-fab-list
一边
＝
＂
结束
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-pwa
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-npm
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-betway东盟体育appionic
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
<
ion-fab-list
一边
＝
＂
底
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-github
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-javascript
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-angular
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
<
ion-fab-list
一边
＝
＂
开始
＂
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-vimeo
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-chrome
＂
>
ion-icon
>
ion-fab-button
>
<
ion-fab-button
>
<
ion-icon
的名字
＝
＂
logo-react
＂
>
ion-icon
>
ion-fab-button
>
ion-fab-list
>
ion-fab
>
］
；
｝
｝
复制
复制
<
模板
>
<
ion-fab
垂直
＝
＂
底
＂
水平
＝
＂
结束
＂
>
<
ion-fab-button
>
分享
ion-fab-button
>
<
ion-fab-list
一边
＝
＂
前
＂
>
<
ion-fab-button
>
脸谱网
ion-fab-button
>
<
ion-fab-button
>
推特
ion-fab-button
>
<
ion-fab-button
>
Youtube
ion-fab-button
>
ion-fab-list
>
<
ion-fab-list
一边
＝
＂
开始
＂
>
<
ion-fab-button
>
Vimeo
ion-fab-button
>
ion-fab-list
>
ion-fab
>
模板
>
<
脚本
>
进口
｛
IonFab
，
IonFabButton
，
IonFabList
｝
从
“@betway东盟体育appionic / vue”
；
进口
｛
defineComponent
｝
从
“vue”
；
出口
默认的
defineComponent
（
｛
组件
：
｛
IonFab
，
IonFabButton
，
IonFabList
｝
｝
）
；
脚本
>
复制
复制
属性
激活 |
|
|---|---|
| 描述 |
如果 |
| 属性 |
激活 |
| 类型 |
布尔 |
| 默认的 |
假 |
一边 |
|
| 描述 |
生产厂列表将显示在相对于主生产厂按钮的一侧。 |
| 属性 |
一边 |
| 类型 |
"bottom" | "end" | "start" | "top" |
| 默认的 |
“底” |