vivy-router

A Vivy plugin to handle router based on connected-react-router.

Docs

• Installation
• Examples
  • Examples in repository
  • Complete and real project example
• Documentation
  • Basic usage

Installation

Using npm:

$ npm install vivy vivy-router

Examples

Examples in repository

$ cd ./examples/[EXAMPLE_NAME]
$ npm run start

Example names:

• withRouterPlugin

Complete and real project example

• labor-analgesia-frontend

Documentation

Basic usage

import React from 'react';
import {render} from 'react-dom';
import {Provider} from 'react-vivy';
import {createBrowserHistory} from 'history';
import {renderRoutes} from 'react-router-config';

// Import Vivy
import Vivy from 'vivy';

// Import VivyRouter and ConnectedRouter
import VivyRouter, {ConnectedRouter} from 'vivy-router';

// Import component
import Root from 'path_to_your_Root_component';

// Import Vivy model
import yourVivyModel from 'path_to_your_vivy_model';

// Routes config
const routes = [{
    path: '/',
    component: Root
}];

// Create browser history
const history = createBrowserHistory();

// Create vivy
const vivy = Vivy();

// Apply router plugin
vivy.use(VivyRouter({
    history
}));

// Create store after configuration
const store = vivy.createStore();

// Register vivy models
store.registerModel(yourVivyModel);

render(
    <Provider store={store}>
        <ConnectedRouter history={history}>
            {renderRoutes(routes)}
        </ConnectedRouter>
    </Provider>,
    document.getElementById('app-container')
);