The current route

Often you will want to get access to the details of the current route that a user is on, to do this you should use the SDK and the app service.

The current route object will have the following properties

• title
  The title of the current route, as it's titled in the builder

• name
  The programmatic route id.

• params
  The parameters, as provided in the url. For example, if you have a route with a dynamic parameter in it's url path /blog/:slug and the user is currently viewing /blog/example-blog-article then route.params.slug would be example-blog-article

• query
  The query string variables as provided from the URL. For example, if the user is viewing /blog?hello=world&foo=bar then route.query would be equal to {hello:"world", foo:"bar"}

• items
  If any of the dynamic parameters of this route are valid IDs, or Slugs for content in your database, the interface will automatically load those items and include them in this object so that you can render the appropriate information on in your interface,

• loading
  Whether this route is still loading it's dynamic content

• loaded
  Whether this route has fully loaded it's dynamic content

Please view the examples below:

Examples

// User is visiting `/website.com/docs/article:getting-access-to-the-current-route?foo=bar&hello=world`

{
  "title": "Documentation Page",
  "name": "page",
  "params": {
    "slug": "article:getting-access-to-the-current-route"
  },
  "query": {
    "foo":"bar",
    "hello":"world"
  },
  "items": {
    "slug": {
      "_id": "64dab19b6110b10e0bf0ff18",
      "title": "The current route"
      "body": "...",
      "data": "..."
      },
      "meta": {
        "abs": "article:getting-access-to-the-current-route"
      },
      
    }
  },
  "loading": false,
  "loaded": true
}

<div>
    <pre>{{$sdk.app.route}}</pre>
</div>

{
    computed: {
        currentRoute() {
            return this.$sdk.app.route;
        }
    }
}