@salsita/react-router

Install this package with npm

Usage no npm install needed!

<script type="module">
  import salsitaReactRouter from 'https://cdn.skypack.dev/@salsita/react-router';
</script>

README

react-router

Install

Install this package with npm

npm i @salsita/react-router

or yarn

yarn add @salsita/react-router

API

Modules

RouterActions
RouterSelectors

Functions

buildRouter(routes, [config], [useListenerPlugin], [useBrowserPlugin])

Builds a router with browserPlugin

routerReducer(state, action) ⇒ RouterState

The reducer of the router module

onRouteTransition(saga, ...params)

Calls saga with params when router transition succeeds. Provides all the routes to be activated.

onRouteEnter(route, saga, ...params)

Call saga when router transition succeeded on particular route.

Link(props)

Renders a link

Route(props)

Renders a component based on the match with the name of the current route

You have to set exactly one of startsWith, endsWith, or exact prop.

Interfaces

LinkProps
RouteProps

RouterActions

See: redux-router5: Using the redux middleware

RouterSelectors

RouterSelectors.getCurrentRoute(state) ⇒ Route

Returns the current route

Kind: static method of RouterSelectors
Returns: Route - The current route

Param Type Description
state RootState The root state

RouterSelectors.getRouteParams(state) ⇒ object

Returns the params of current route

Kind: static method of RouterSelectors
Returns: object - The current route params

Param Type Description
state RootState The root state

LinkProps

Kind: global interface
Properties

Name Type Description
name string Route name
[params] object Route params

RouteProps

Kind: global interface
Properties

Name Type Description
component Component The component to render
[startsWith] string Renders the component if the route name starts with this
[endsWith] string Renders the component if the route name ends with this
[exact] string Renders the component if the route name exactly matches this

buildRouter(routes, [config], [useListenerPlugin], [useBrowserPlugin])

Builds a router with browserPlugin

Kind: global function

Param Type Default Description
routes Array.<Route> An array of routes
[config] Options A config object for router5
[useListenerPlugin] boolean false Add listener plugin
[useBrowserPlugin] boolean true Add browser plugin

routerReducer(state, action) ⇒ RouterState

The reducer of the router module

Kind: global function

Param Type Description
state RouterState The state of router5
action Action A redux action

onRouteTransition(saga, ...params)

Calls saga with params when router transition succeeds. Provides all the routes to be activated.

Kind: global function

Param Type Description
saga Generator The saga to be called
...params any The params to be passed to the saga

onRouteEnter(route, saga, ...params)

Call saga when router transition succeeded on particular route.

Kind: global function

Param Type Description
route string The route name to match
saga Generator The saga to be called
...params any The params to be passed to the saga

Link(props)

Renders a link

Kind: global function

Param Type Description
props LinkProps Properties

Route(props)

Renders a component based on the match with the name of the current route

You have to set exactly one of startsWith, endsWith, or exact prop.

Kind: global function

Param Type Description
props RouteProps Properties