Rocon Website

SingleHashRouteBuilder

type SingleHashRouteBuilder<
  ActionResult,
  WildcardFlag extends WildcardFlagType,
  Match
>

The Single Hash route builder is a route builder that represents the whole hash part (#id) of a URL as a single string.

A Single Hash route builder always holds one route record that represents a route with a hash value.

Initiaization

Rocon.SingleHash<Key extends string, IsOptional extends boolean>(
  matchKey: Key,
  options?: SingleHashRouteBuilderOptions<IsOptional>
): SingleHashRouteBuilder<...>

type SingleHashRouteBuilderOptions<IsOptional extends boolean> = {
  optional?: IsOptional;
};

Creates a new instance of Single Hash route builder. It has one route defined from first that has no action. To define a route with action, use the action method.

• matchKey: Match key with which the hash string is saved in the match object.
• optional: If true, this Single Hash route builder matches a URL without hash string. Defaults to false.

Example

const toplevel = Rocon.Path()
  .route("foo");
// Creates a route record for /foo which allows
// specifying a hash string through the "hash" match object field
const fooRoute = toplevel._.foo
  .attach(Rocon.SingleHash("hash", { optional: true }))
  .action(({ hash }) => <p>Hash string is {hash}</p>)
  .route;

// In a component
const navigate = useNavigate();
// navigates to /foo#id
navigate(fooRoute, { hash: "id" });

builder.action(func)

action(
  action: ActionType<ActionResult, Match>
): SingleHashRouteBuilder<...>

Returns a new Single Hash route builder whose single route has an action associated to it.

Example

// Create a Single Hash route buillder.
// By accessing /#abcde you see "The hash string is abcde"
const toplevel = Rocon.SingleHash("hash")
  .action(({ hash }) => <p>The hash string is {hash}</p>);

builder.attach(otherBuilder)

attach: AttachFunction<ActionResult, Match>

Alias of builder.route.attach(otherBuilder). Attaches otherBuilder to this builder's route and returns otherBuilder.

Example

// By placing Single Hash route at the very top of composed builders,
// All routes accept specifying hash string on navigation.
const toplevel = Rocon.SingleHash("hash")
  .attach(Rocon.Path())
  .route("foo", (r) => r.action(({ hash }) => <p>Hash string is {hash}</p>));

builder.route

The route record defined by this Single Hash route builder.