Rocon Website

StateRouteBuilder

type StateRouteBuilder<
  ActionResult,
  StateValue,
  WildcardFlag extends WildcardFlagType,
  Match
>

The State route builder is a route builder that defines one key in the location.state object. By attaching to another route, it can define a new route with a location.state key added.

A State route builder always holds one route record that represents a route with the specified location.state key.

Initiaization

Rocon.State<Key extends string, StateValue, IsOptional extends boolean>(
  matchKey: Key,
  validator: Validator<StateValue>,
  options?: StateRouteBuilderOptions<IsOptional>
): StateRouteBuilder<...>

type Validator<R> = (value: unknown) => value is R;
type StateRouteBuilderOptions<IsOptional extends boolean> = {
  stateKey?: string;
  optional?: IsOptional;
};

Creates a new instance of State route builder. It has one route defined from first which has no action at first. To define a route with action, use the action method.

• matchKey: Match key with which the value of location.state field is saved in the match object.
• validator: Runtime validation function that validates that a given value is of type StateValue.
• stateKey: Name of location.state key. Same as matchKey by default.
• optional: If true, this State route builder matches a history record without corresponding location.state key. Defaults to false.

Example

const isString: (value: unknown): value is string => typeof value === "string";
// Creates a route record which represents / and requires a string
// to be stored in location.state with key 'foo'
const builder = Rocon.State("foo", isString);

builder.action(func)

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

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

Example

const fooStateRoute = Rocon.State("foo")
  .action(({ foo }) => <p>The value of foo in location.state is {foo}</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 attaching one State route builder to another, you can
// create a builder for a route with two keys in location.state
const foobarRoute = Rocon.State("foo", isString)
  .attach(Rocon.State("bar", isNumber))
  .action(({ foo, bar }) => <p>Foo is {foo} and bar is {bar}</p>);

builder.route

The route record defined by this State route builder.