Skip to content

lit-ui-router / UiOnExit

Interface: UiOnExit

Defined in: packages/lit-ui-router/src/interface.ts:83

Interface for components that can prevent or confirm navigation away.

When a component implements this interface, UI-Router will call the uiCanExit method before navigating away from the component's state. This can be used to prompt for confirmation or prevent navigation.

Example

ts
class EditForm extends LitElement implements UiOnExit {
  hasUnsavedChanges = false;

  uiCanExit(trans?: Transition): HookResult {
    if (this.hasUnsavedChanges) {
      return window.confirm('Discard unsaved changes?');
    }
    return true;
  }
}

See

Methods

uiCanExit()

ts
uiCanExit(newTransition?): HookResult;

Defined in: packages/lit-ui-router/src/interface.ts:108

A UI-Router view has a Lit Component (see NormalizedLitViewDeclaration.component). The Component may define component-level hooks which UI-Router will call at the appropriate times. These callbacks are similar to Transition Hooks (IHookRegistry), but are only called if the view/component is currently active.

The uiCanExit callback is called when the routed component's state is about to be exited.

The callback can be used to cancel or alter the new Transition that would otherwise exit the component's state.

This callback is used to inform a view that it is about to be exited, due to a new Transition. The callback can ask for user confirmation, and cancel or alter the new Transition. The callback should return a value, or a promise for a value. If a promise is returned, the new Transition waits until the promise settles.

Called when:

  • The component is still active inside a ui-view
  • A new Transition is about to run
  • The new Transition will exit the view's state

Called with:

  • The Transition that is about to exit the component's state

Parameters

ParameterType
newTransition?Transition

Returns

HookResult

a hook result which may cancel or alter the pending Transition (see HookResult)