Route configuration

The routing configuration is a hierarchical structure used to describe the entire Dojo application, associating outlet ids to a routing path. The routing path can be nested using children which enables building a routing structure that can accurately reflect the requirements of the application.

The routing configuration API is constructed with the following properties:

  • path: string: The routing path segment to match in the URL.
  • outlet: string: The outlet id used to render widgets to the associated routing path.
  • defaultRoute: boolean (optional): Marks the outlet as default, the application will redirect to this route automatically if no route or an unknown route is found on application load.
  • defaultParams: { [index: string]: string } (optional): Associated default parameters (path and query), required if the default route has required params.
  • children: RouteConfig[] (optional): Nested child routing configuration.

src/routes.ts

  1. export default [
  2. {
  3. path: 'home',
  4. outlet: 'home',
  5. defaultRoute: true
  6. },
  7. {
  8. path: 'about',
  9. outlet: 'about-overview',
  10. children: [
  11. {
  12. path: '{services}',
  13. outlet: 'about-services'
  14. },
  15. {
  16. path: 'company',
  17. outlet: 'about-company'
  18. },
  19. {
  20. path: 'history',
  21. outlet: 'about-history'
  22. }
  23. ]
  24. }
  25. ];

This example would register the following routes and outlets:

URL PathOutlet
/homehome
/aboutabout-overview
/about/companyabout-company
/about/historyabout-history
/about/knittingabout-services
/about/sewingabout-services

The about-services outlet has been registered to match any path after /about This is at odds with the other registered outlets, about-company and about-history, however Dojo routing ensures that the correct outlet is matched in these scenarios.