furo-location #

@furo/route v2.6.13
import '@furo/route/src/furo-location.js';
exports FuroLocation js
exports <furo-location> custom-element-definition
superclass LitElement
summary url watcher

furo-location watches for URL changes and notifies you. The location object which is fired from furo-location can be used for page navigation in furo-pages or for deep link resolution.

1
2
3
4
5
6
7
8
9

<furo-location at-location-changed="--pathChanged"></furo-location>

<furo-pages
  fn-inject-location="--pathChanged"
  default="list">
    <view-list name="list"></view-list>
    <view-create name="create"></view-create>
    <view-detail name="detail"></view-detail>
</furo-pages>

locationObject #

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

{
    "host": "localhost:8480",
    "query": {"tsk": 999},
    "hash": {},
    "path": "/detail",
    "pathSegments": [
        "detail"
    ],
    "hashstring": "",
    "querystring": "tsk=999"
}

Attributes and Properties #

urlSpaceRegex #

url-space-regex string|RegExp default: ''

A regexp that defines the set of URLs that should be considered part of this web app.

Clicking on a link that matches this regex won’t result in a full page navigation, but will instead just update the URL state in place.

This regexp is given everything after the origin in an absolute URL. So to match just URLs that start with /app/ do: url-space-regex="^/app/"

If you plan to work in sub directories, you may set url-space-regex="^${window.APPROOT}/additional/path". Keep in mind to put a “url-space-regex” on every furo-location. Otherwise you can not switch between apps in different folders with a link.

Events #

location-path-changed #

at-location-path-changed → Location object

Fired when Path portion of the location changed

location-hash-changed #

at-location-hash-changed → Location object

Fired when Hash portion of the location changed

location-query-changed #

at-location-query-changed → Location object

Fired when Query portion of the location changed

location-changed #

at-location-changed → Location object

Fired when something in the location changed

external-link-clicked #

at-external-link-clicked → Location object

Fired when a external link was clicked

url-space-entered #

at-url-space-entered → Location object

Fired when the path matches the url-space-regex and neither a search query or hash was given, useful to detect if someone enters the current url

__beforeReplaceState #

at-__beforeReplaceState → void

Fired when before the state will be updated

Methods #