Narwhals Poke Mammals

    @uirouter/react
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.7 • Public • Published

    UI-Router-React

    Greenkeeper badge

    UI-Router provides extremely flexible, state based routing to the React ecosystem.

    Routing frameworks for SPAs update the browser's URL as the user navigates through the app. Conversely, this allows changes to the browser's URL to drive navigation through the app, thus allowing the user to create a bookmark to a location deep within the SPA.

    UI-Router applications are modeled as a hierarchical tree of states. UI-Router provides a state machine to manage the transitions between those application states in a transaction-like manner.

    Docs & Resources

    Getting started

    The UI-Router package is distributed using npm, the node package manager.

    yarn add @uirouter/react
    

    Import UIRouter into your project, define some states and you're good to go!

    import React from 'react';
    import ReactDOM from 'react-dom';
    import { UIRouter, UIView, pushStateLocationPlugin } from '@uirouter/react';
    import Home from './components/Home';
    
    // define your states
    const states = [
      {
        name: 'home',
        url: '/home',
        component: Home,
      },
    ];
    
    // select your plugins
    const plugins = [pushStateLocationPlugin];
    
    ReactDOM.render(
      <UIRouter plugins={plugins} states={states}>
        <UIView />
      </UIRouter>,
      document.getElementById('root'),
    );

    Keywords

    none

    Install

    npm i @uirouter/react

    DownloadsWeekly Downloads

    10,692

    Version

    1.0.7

    License

    MIT

    Unpacked Size

    2.69 MB

    Total Files

    161

    Last publish

    Collaborators

    • christopherthielen
    • nateabele
    • elboman
    • wawyed