Note

This documentation describes the MethodButton Vue component for native UI views for Xml templates see button with type="method".

MethodButton

A button that directly calls a provided async function when clicked. Unlike ActionButton, it is not bound to a ViewModel action.

Import

import { MethodButton } from '@neos/app'

Props

Prop	Type	Default	Description
method	(item?: unknown) => Promise<void>	—	Required. The async function to call on click
item	unknown	undefined	Optional argument passed to method
propagateClick	boolean	false	When false, stops the click event from bubbling up
animated	boolean	true	Enable loading spinner animation while the method is executing

Slots

Slot	Description
default	Button content (label, icon) — passed to the inner Button component

Usage Examples

Simple action button

<MethodButton :method="sendNotification">
  <button label="Send Notification" icon="pi pi-bell" />
</MethodButton>

Row action with item

<Datagrid>
  <template #actions-display="{ cell }">
    <MethodButton :method="archiveItem" :item="cell.item" :propagate-click="false">
      <button label="Archive" size="small" />
    </MethodButton>
  </template>
</Datagrid>

With loading animation

<MethodButton :method="exportData" :animated="true">
  <button label="Export" icon="pi pi-download" variant="secondary" />
</MethodButton>