This component displays the child elements of the Material Design Speed dial component.
The speed dial component is a Material Design component that displays a floating action button that expands into a menu when tapped. It’s useful for situations where there are several actions needs to be displayed that are of equal importance.
The menu items of the SpeedDial
component are defined using the VOnsSpeedDialItem
component. It also requires a VOnsFab
component which represents the main button.
To define the position of the component the position
property can be specified. By default it is placed in the bottom right corner which can also be achieved by setting the property to the literal string "bottom right"
.
In order to show or hide VOnsSpeedDial
, the visible
prop must be used. The items will toggle by default when clicking on the button. However, the open
prop can optionally be provided in order to programatically show or hide the items. In that case, the onClick
prop must be set as well in order to change the value of the open
prop and keep it updated:
<v-ons-speed-dial :open="isOpen" @click="() => isOpen = !isOpen">...</v-ons-speed-dial>
Name | Type | Description |
---|---|---|
modifier | String | The appearance of the component. Optional. |
ripple | Boolean | If this attribute is defined, the button will have a ripple effect when tapped. Optional. |
If you have any questions, use our Community Forum or talk to us on Discord chat. The Onsen UI team and your peers in the community will work together to help solve your issues.
For bug reports and feature requests use our GitHub Issues page.