rxstore-react-router

Official Rxstore Observer bindings for React Router

Usage no npm install needed!

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

README

RxStore React Router

This is the official React Router bindings for React RxStore Observer.

This project is currently in development.

Usage:

import { createRouterObserver, push, routerReducer } from 'rxstore-react-router'
import { createRxStore, combineReducers } from 'rxstore-observer'
import { BrowserRouter as Router } from 'react-router-dom'
import { Switch, Route } from 'react-router'
import { Path1, Path2 } from './components'
import storeReducer from './reducer'

const store = createRxStore( combineReducers({ main: storeReducer, route: routerReducer }) )

const RouterObserver = createRouterObserver(store)

const YourAwesomeApp = () => {
    return (
        <Router>
            <RouterObserver>
                <Switch>
                    <Route path="/path-1" exact={ true } component={ Path1 }/>
                    <Route path="/path-2" exact={ true } component={ Path2 }/>
                </Switch>
            </RouterObserver>
        </Router>
    )
}

store.dispatch( push('/path-2') ) // Calls history.push. Awesome!