Skip to content

lit-ui-router / UIViewInjectedProps

Interface: UIViewInjectedProps<T>

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

Props injected into routed components by the <ui-view> element.

These props provide access to the current transition, resolved data, and the router instance. Components can use these to access routing state and navigate programmatically.

Examples

ts
const UserDetail: RoutedLitTemplate = (props) => {
  const { resolves, router } = props!;
  return html`
    <h1>User: ${resolves?.user?.name}</h1>
    <button @click=${() => router.stateService.go('users')}>
      Back to Users
    </button>
  `;
};
ts
class UserDetail extends LitElement {
  _uiViewProps?: UIViewInjectedProps<{ user: User }>;

  render() {
    const user = this._uiViewProps?.resolves?.user;
    return html`<h1>${user?.name}</h1>`;
  }
}

See

Type Parameters

Type ParameterDefault typeDescription
T extends DefaultResolvesTypeDefaultResolvesTypeThe shape of the resolved values object

Properties

PropertyTypeDescriptionDefined in
resolvesTResolved data from state declarationspackages/lit-ui-router/src/interface.ts:179
routerUIRouterThe UIRouter instance for programmatic navigationpackages/lit-ui-router/src/interface.ts:181
transition?TransitionThe current transition (if one is in progress)packages/lit-ui-router/src/interface.ts:177