Actions abbrechen
Wenn eine Action abgebrochen werden soll, ohne einen Fehler auszulösen, kann die
Funktion abortAction aus dem Action-Modul verwendet werden. Diese Funktion
wirft einen speziellen Fehler, der von der Action-Component erkannt wird.
Dadurch kann die Action sauber abgebrochen werden, ohne dass unerwünschte
Fehlermeldungen oder Seiteneffekte auftreten.
Alle nachfolgenden Funktionen in der Action-Execution-Logik, die nach dem Aufruf
von abortAction definiert sind, werden nicht mehr ausgeführt. Das bedeutet,
dass der gesamte Ablauf der Action sofort gestoppt wird, sobald abortAction
aufgerufen wird.
Umschließende Actions bei einer Verschachtelung von Actions werden ebenfalls
abgebrochen, wenn abortAction in einer inneren Action aufgerufen wird.
import { sleep } from "@/content/04-components/actions/action/examples/lib"; import { abortAction, Action, Button, } from "@mittwald/flow-react-components"; <Action onAction={() => { console.log("Outer action"); }} > <Action onAction={async () => { await sleep(); console.log("Inner action"); abortAction(); }} > <Button>Start action</Button> </Action> </Action>
Properties
| Property | Type | Default | Description |
|---|---|---|---|
actionModel | ActionModel | - | An existing action model to use instead of creating a new one. Lets several components share one action state. |
closeOverlay | keyof FlowComponentPropsTypes | OverlayController | CloseOverlayOptions | - | The overlay to close when the action is triggered. |
openOverlay | keyof FlowComponentPropsTypes | OverlayController | - | The overlay to open when the action is triggered. |
toggleOverlay | keyof FlowComponentPropsTypes | OverlayController | - | The overlay to open or close when the action is triggered. |
closeModal | boolean | CloseModalOptions | - | Whether the surrounding modal is closed when the action is triggered. |
openModal | boolean | - | Whether the surrounding modal is opened when the action is triggered. |
toggleModal | boolean | - | Whether the surrounding modal is opened or closed when the action is triggered. |
break | boolean | false | Stops the execution here: parent actions are not executed. |
skip | number | boolean | false | The number of parent actions skipped when the action is triggered. `true` skips one. |
showFeedback | boolean | - | Whether success feedback is shown after the action succeeded. Asynchronous actions show feedback by default; set `false` to suppress it. |
children | ReactNode | - | |
wrapWith | ReactElement<unknown, string | JSXElementConstructor<any>> | - | A React element the component is wrapped with. The element is cloned and receives the component as its only child — useful to render the component inside a link, a tooltip trigger or any other wrapper without changing the surrounding markup. |
ref | Ref<HTMLSpanElement> | - | Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref). @see React Docs |
key | Key | - |
Events
| Property | Type | Default | Description |
|---|---|---|---|
onAction | ActionFn | - | The function executed when the action is triggered. Returning a promise puts the action into its pending and feedback states automatically. |