route_hierarchical 0.7.0

  • README.md
  • CHANGELOG.md
  • Installing
  • Versions
  • 77

Route

Route is a client routing library for Dart that helps make building single-page web apps.

Installation

Add this package to your pubspec.yaml file:

dependencies:
  route_hierarchical: any

Then, run pub install to download and link in the package.

UrlMatcher

Route is built around UrlMatcher, an interface that defines URL template parsing, matching and reversing.

UrlTemplate

The default implementation of the UrlMatcher is UrlTemplate. As an example, consider a blog with a home page and an article page. The article URL has the form /article/1234. It can matched by the following template: /article/:articleId.

Router

Router is a stateful object that contains routes and can perform URL routing on those routes.

The Router can listen to Window.onPopState (or fallback to Window.onHashChange in older browsers) events and invoke the correct handler so that the back button seamlessly works.

Example (client.dart):

library client;

import 'package:route_hierarchical/client.dart';

main() {
  var router = new Router();
  router.root
    ..addRoute(name: 'article', path: '/article/:articleId', enter: showArticle)
    ..addRoute(name: 'home', defaultRoute: true, path: '/', enter: showHome);
  router.listen();
}

void showHome(RouteEvent e) {
  // nothing to parse from path, since there are no groups
}

void showArticle(RouteEvent e) {
  var articleId = e.parameters['articleId'];
  // show article page with loading indicator
  // load article from server, then render article
}

The client side router can let you define nested routes.

var router = new Router();
router.root
  ..addRoute(
     name: 'usersList',
     path: '/users',
     defaultRoute: true,
     enter: showUsersList)
  ..addRoute(
     name: 'user',
     path: '/user/:userId',
     mount: (router) =>
       router
         ..addRoute(
             name: 'articleList',
             path: '/acticles',
             defaultRoute: true,
             enter: showArticlesList)
         ..addRoute(
             name: 'article',
             path: '/article/:articleId',
             mount: (router) =>
               router
                 ..addRoute(
                     name: 'view',
                     path: '/view',
                     defaultRoute: true,
                     enter: viewArticle)
                 ..addRoute(
                     name: 'edit',
                     path: '/edit',
                     enter: editArticle)))

The mount parameter takes either a function that accepts an instance of a new child router as the only parameter, or an instance of an object that implements Routable interface.

typedef void MountFn(Router router);

or

abstract class Routable {
  void configureRoute(Route router);
}

In either case, the child router is instantiated by the parent router an injected into the mount point, at which point child router can be configured with new routes.

Routing with hierarchical router: when the parent router performs a prefix match on the URL, it removes the matched part from the URL and invokes the child router with the remaining tail.

For instance, with the above example lets consider this URL: /user/jsmith/article/1234. Route "user" will match /user/jsmith and invoke the child router with /article/1234. Route "article" will match /article/1234 and invoke the child router with ``. Route "view" will be matched as the default route. The resulting route path will be: user -> article -> view, or simply user.article.view

Named Routes in Hierarchical Routers

router.go('usersList');
router.go('user.articles', {'userId': 'jsmith'});
router.go('user.article.view', {
  'userId': 'jsmith',
  'articleId', 1234}
);
router.go('user.article.edit', {
  'userId': 'jsmith',
  'articleId', 1234}
);

If "go" is invoked on child routers, the router can automatically reconstruct and generate the new URL from the state in the parent routers.

v0.6.3

Breaking changes

  • UrlPattern has been removed. It was deprecated in v0.6.2.
  • package:unittest replaced by package:test
  • package:mock replaced by package:mockito

Fixes

  • Strong-mode analysis is clean (except some warnings in unit tests)

v0.6.2

Fixes

  • correctly include query parameters when using pushState #95

Features

  • allow specifying route page title #10

v0.6.1

Features

  • Added forceReload param to Router.go which forces reloading of already active routes.

v0.6.0

Features

  • Introduced reload({startingFrom}) method which allows to force reload currently active routes.
  • UrlPattern now support paramerter values that contain slashes (/foo/:bar* which will fully match /foo/bar/baz)

BREAKING CHANGE: The router no longer requires prefixing query param names with route name. By default all query param changes will trigger route reload, but you can provide a list of param patterns (via watchQueryParameters named param on addRoute) which will be used to match (prefix match) param names that trigger route reloading. A short-hand for "I don't care about any parameters, never reload" is watchQueryParameters: [].

v0.5.0

Breaking changes

  • UrlMatcher.urlParameterNames has been changed from a method to a getter. The client code must be updated accordingly:

    Before:

      var names = urlMatcher.urlParameterNames();
    

    After:

      var names = urlMatcher.urlParameterNames;
    

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  route_hierarchical: "^0.7.0"

2. Install it

You can install packages from the command line:

with pub:


$ pub get

Alternatively, your editor might support pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:route_hierarchical/click_handler.dart';

import 'package:route_hierarchical/client.dart';

import 'package:route_hierarchical/link_matcher.dart';

import 'package:route_hierarchical/route_handle.dart';

import 'package:route_hierarchical/url_matcher.dart';

import 'package:route_hierarchical/url_template.dart';
        
Version Uploaded Documentation Archive
0.7.0 Apr 15, 2016 Go to the documentation of route_hierarchical 0.7.0 Download route_hierarchical 0.7.0 archive
0.6.2 May 27, 2015 Go to the documentation of route_hierarchical 0.6.2 Download route_hierarchical 0.6.2 archive
0.6.1+1 Feb 2, 2015 Go to the documentation of route_hierarchical 0.6.1+1 Download route_hierarchical 0.6.1+1 archive
0.6.1 Nov 3, 2014 Go to the documentation of route_hierarchical 0.6.1 Download route_hierarchical 0.6.1 archive
0.6.0 Oct 23, 2014 Go to the documentation of route_hierarchical 0.6.0 Download route_hierarchical 0.6.0 archive
0.5.0 Sep 15, 2014 Go to the documentation of route_hierarchical 0.5.0 Download route_hierarchical 0.5.0 archive
0.4.22 Aug 11, 2014 Go to the documentation of route_hierarchical 0.4.22 Download route_hierarchical 0.4.22 archive
0.4.21 May 26, 2014 Go to the documentation of route_hierarchical 0.4.21 Download route_hierarchical 0.4.21 archive
0.4.20 May 7, 2014 Go to the documentation of route_hierarchical 0.4.20 Download route_hierarchical 0.4.20 archive
0.4.19 Apr 25, 2014 Go to the documentation of route_hierarchical 0.4.19 Download route_hierarchical 0.4.19 archive

All 22 versions...

Analysis

This feature is new.
We welcome feedback.
More details: scoring.

We analyzed this package, and provided a score, details, and suggestions below.

  • completed on Jan 17, 2018
  • Dart: 2.0.0-dev.15.0
  • pana: 0.9.1

Scores

Popularity:
Describes how popular the package is relative to other packages. [more]
86 / 100
Health:
Code health derived from static analysis. [more]
99 / 100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
23 / 100
Overall score:
Weighted score of the above. [more]
77

Platforms

Detected platforms: web

All libraries have the same platform restriction.

Suggestions

  • Use constrained dependencies.

    The pubspec.yaml contains 1 dependency without version constraints. Specify version ranges for the following dependencies: logging.

  • The description is too short.

    Add more detail about the package, what it does and what is its target use case. Try to write at least 60 characters.

  • Package is pre-v1 release.

    While there is nothing inherently wrong with versions of 0.*.*, it usually means that the author is still experimenting with the general direction API.

  • Maintain an example.

    None of the files in your example/ directory matches a known example patterns. Common file name patterns include: main.dart, example.dart or you could also use route_hierarchical.dart.

Dependencies

Package Constraint Resolved Available
Direct dependencies
logging any 0.11.3+1
Dev dependencies
browser any
mockito any
test any