ion-fab-list

概要(CONTENTS)

Ionic4项目中我们可以使用Ionic4浮动按钮组件ion-fab-list对项目进行布局。ion-fab-list中有ionic ion-fab-list 用法(Usage) ,ionic ion-fab-list 属性(Properties)等

The ion-fab-list element is a container for multiple fab buttons. This collection of fab buttons contains actions related to the main fab button and is flung out on click. To specify what side the buttons should appear on, set the side property to 'start', 'end', 'top', 'bottom'

ion-fab-list 用法(Usage)

angular javascript
<ion-fab vertical="bottom" horizontal="end">
  <ion-fab-button>Shareion-fab-button>

  <ion-fab-list side="top">
    <ion-fab-button>Facebookion-fab-button>
    <ion-fab-button>Twitterion-fab-button>
    <ion-fab-button>Youtubeion-fab-button>
  ion-fab-list>

  <ion-fab-list side="start">
    <ion-fab-button>Vimeoion-fab-button>
  ion-fab-list>

ion-fab>
<ion-fab vertical="bottom" horizontal="end">
  <ion-fab-button>Shareion-fab-button>

  <ion-fab-list side="top">
    <ion-fab-button>Facebookion-fab-button>
    <ion-fab-button>Twitterion-fab-button>
    <ion-fab-button>Youtubeion-fab-button>
  ion-fab-list>

  <ion-fab-list side="start">
    <ion-fab-button>Vimeoion-fab-button>
  ion-fab-list>

ion-fab>

ion-fab-list 属性(Properties)

activated

Description

If true, the fab list will be show all fab buttons in the list.

Attribute activated
Type boolean

side

Description

The side the fab list will show on relative to the main fab button.

Attribute side
Type "bottom" | "end" | "start" | "top"