hoc-little-router

HOC to hide a component when the route didn't match. Edit

Usage no npm install needed!

<script type="module">
  import hocLittleRouter from 'https://cdn.skypack.dev/hoc-little-router';
</script>

README

hoc-little-router

CircleCI NPM Version Coverage Status Size Greenkeeper badge

redux-little-router HOC to render a component when the route is matching!

You need redux-little-router for that HOC.

Examples

routes (redux-little-router ones)

export default {
  '/': {
    title: 'HOME',
    '/search': {
      title: 'SEARCH',
    },
  },
}

Relative

The Home component will be printed when redux-little-router find a title that match HOME from URL and its parents.

// ...
import router from 'hoc-little-router'

class Home extends React.Component {
// ...

export default router('HOME')(Home)
  • / : Home Component is printed
  • /search : Home Component is printed

List screens

You can attach the same component to multiple routes like this:

import router from 'hoc-little-router'

class Menu extends React.Component {
// ...

export default router(['HOME', 'SEARCH'])(Menu)

Absolute

The Home component will be printed when redux-little-router find a title that match HOME from URL but not its parents.

// ...
import router from 'hoc-little-router'

class Home extends React.Component {
// ...

export default router('HOME', { absolute: true })(Home)
// or
export default router.absolute('HOME')(Home)
  • / : Home Component is printed
  • /search : Home Component is not printed

About alakarteio

alakarteio is created by two passionate french developers.

Do you want to contact them ? Go to their website

Guillaume CRESPEL Fabien JUIF