"hooks/useSref" | @uirouter/react
Options
All
  • Public
  • Public/Protected
  • All
Menu

Module "hooks/useSref"

Index

Interfaces

Functions

Functions

useSref

  • A hook to create a link to a state.

    This hook returns link (anchor tag) props for a given state reference. The resulting props can be spread onto an anchor tag.

    The props returned from this hook are:

    • href: the browser URL of the referenced state
    • onClick: a mouse event handler that will active the referenced state

    Example:

    function HomeLink() {
      const sref = useSref('home');
      return <a {...sref}>Home</a>
    }

    Example:

    function UserLink({ userId, username }) {
      const sref = useSref('users.user', { userId: userId });
      return <a {...sref}>{username}</a>
    }

    The onClick handler falls back to native browser behavior (does not initiate a state transition) when:

    • the user Ctrl+Click / Alt+Click / Meta+Click / Shift+Click
    • the underlying tag (e.g.: anchor tag) has a 'target' attribute, such as <a target="_blank">Open in new window</a>
    • preventDefault has been called on the event, e.g.: <a onClick={e => e.preventDefault()}>no-op</a>

    Parameters

    • stateName: string

      The name of the state to link to

    • Default value params: object = {}

      Any parameter values

    • Default value options: TransitionOptions = {}

      Transition options used when the onClick handler fires.

    Returns LinkProps

Generated using TypeDoc