React Queue Router

<QueueRouter/>

Description

<QueueRouter/> component is a wrapper component that enables descendant components to use React Queue Router's API.

It should be one of the top level components of your app.

It should not be unmounted once it mounted because it will make a reference with history.listen and unmount possibly might cause memory leak.

Basic Usage

<QueueRouter/> component always comes with <Switch/> component as its descendant.

App.jsx
import React from 'react'
import {QueueRouter, Switch} from 'react-queue-router'

const App = () => {
  return (
    <QueueRouter>
      <Switch>
        {/* content */}
      </Switch>
    </QueueRouter>
  )
 }
 
export default App

Another Case

<Switch/> component does not have to be a direct child.

App.jsx
import React from 'react'
import {QueueRouter, Switch} from 'react-queue-router'

const App = () => {
  // This is valid.
  return (
    <QueueRouter>
      <div className='container'>
        <Switch>
          {/* content */}
        </Switch>
      </div>
    </QueueRouter>
  )
 }
 
export default App